HTML笔记（下）

一、跑马灯标签

<marquee></marquee>

主要用于实现一些内容不断移动的动画

常用的属性：

width：定义宽度

height：定义高度

behavior：行为，取值：scroll（默认）、alternate（往返滚动）、slide（只滚动一次）

direction：移动方向，取值：left（默认从右向左）、right（从左向右）、up（从下往上）、down（从上往下）

scrolldelay：运行的间隔时间

scrollamount：设置移动的步长

二、表单

为用户提供各种输入区域（通过键盘输入、通过鼠标点击......选择文件），用于接收用户的数据，并传递到后台服务器

<form></form>

form表单是一个容器标签，在HTML4中所有的其他的表单标签必须位于此标签内。

常用的属性：

action： 主要用于指定表单中数据的接收脚本（此脚本就是PHP文件）

method：设置数据的提交方式

取值：

get：将用户输入的数据放在url之后，传输给后台PHP文件。特点：不安全，传输的数据量小，2k左右，传输的数据类型单一，只能传递文本信息，

主要用于从服务器获取数据。

post：

如果是post方式，那么会将表单中用户输入的数据放在http协议的内部传递到后台PHP文件。

特点：相对于get来说安全，传递的数据量大，传递的数据类型多样。不仅传递文本，还可以传递图片。

主要是用于从客户端向服务器传递数据。

enctype：主要是用于设置文件上传。

取值：

application/x-www-url-encode  默认，只能传递文本

multipart/form-data主要用于文件上传

三、表单项

表单项，主要用于为用户提供一个可以输入内容或者选择的区域。

<input/>

设置不同类型的表单输入区域。

常用的属性：

type：主要用于设置表单输入区域的类型（可以输入的，还是可以点击，还是可以选择的）

取值：

text：主要用于定义单行文本框，如用户名、公司名、地址、邮箱、电话号码等

它的value属性就是默认显示的文字

password：主要为用户提供一个密码输入框，以密文形式显示

它的value属性是初次显示时的默认内容

radio：用于设置单选按钮，一组选项中只能选择一个

它的value属性是后台要提交的数据，name属性用于关联必须一样，checked属性用于默认的选择项（checked = "checked"）

checkbox：用于设置多选框

它的value属性、checked和radio一样，name属性使用数组的方式

submit：主要用于设置提交按钮，当用户点击提交按钮时，会将表单中的数据传递到form表单中的action所指向的PHP文件。

reset：主要用于设置重置按钮

image：可以定义一张图片作为提交按钮，用src引出图片资源路径

button：普通按钮，相应一个事件

file：主要用于用户选择文件上传，如果想实现文件上传，必须要设置以下3点：

1.form标签的method必须是post

2.form标签的enctype必须是multipart/form-data

3.必须要有<input type="file"> 标签

name：用于为表单的输入区域设置一个名字（一定要有）

解释：由于用户可以有输入多项数据，多项数据都会被后台接收，如果只有数据，后台无法区分数据的作用。

四、下拉列表

语法：

<select>

<option>选项一</option>

<option>选项二</option>

<option>选项三</option>

</select>

<select >标签常用的属性：

name   主要用于被选中的下拉列表项的数据起个名字

<option>标签常用属性：

value   设置向后台传递的数据

selected = “selected” 默认选中项

<optgroup></optgroup>

主要是对下拉列表中的option标签进行分组

常用的属性：

label：主要是对分组进行命名

disable：主要用于禁止此组

<textarea></textarea>

主要用于多行文本框

主要属性：

cols：设置多行文本框的宽度

rows：设置多行文本框的高度

注意：textarea 是唯一的一个包含html标签而不被解析的容器标签。

五、fieldset&legend&label

<fieldset></fieldset>

主要是用于对一个form表单中的表单项进行分组，并显示一个框

<legend></legend>

主要对使用fieldset分成的组，起个名子，一定紧随fieldset之后

示例：

<label></label>标签

主要用于将表单的用户提示信息与表单进行绑定，当点击提示信息时，就相当于点击了与之绑定的表单。

常用的属性：

for 用于设置被绑定的表单

取值： 被绑定的表单的id属性值

简化用法：

使用<label></label>来包含表单，及表间的用户提示信息。

示例：

六、框架

<frameset></frameset>

主要是用于对浏览器窗口进行划分成多个区域，每个相当于一个小的显示内容的浏览器。具体网页是显示在每一个小的区域内。

常用的属性：

rows 用于设置对浏览器窗口进行垂直划分

取值：

可以是整数、百分比、*（剩余的区域）

cols

frameborder 主要用于设置是否显示边框

取值：

1或yes 显示框架的边框

0或no 不显示框架的边框

 

<frame>标签

主要用于对framset划分后的区域指定网页

示例：

常用的属性：

src 指定路径(url)

noresize 禁止更改区域大小

取值：

1或yes 不允许更改大小

0或no 允许更改大小

scrolling 设置滚动条的显示方式

取值：

auto 根据内容自行判断是否显示滚动条

yes 无效果

no 记不显示滚动条

 

name 主要是用于为某个fame定义一个标识(起个名子)

为frame定义标识，就是为了与A链接进行绑定：

如何绑定A链接与frame标签呢？

就是将A链接的target设置为frame标签的name属性值

示例：

<noframes></noframes>

示例：

说明：

frameset框架，要么有body要么有frameset（二选一）

frameset先划分窗口，再在划分好的窗口内使用frame标签指定页面。

 

iframe

内嵌框架，在已有的页面内再嵌入一个页面

常用的属性：

src 指定被嵌入页面文件

frameborder 指定边框是否显示

取值：

1或yes 显示框架的边框

0或no 不显示框架的边框

width 设置宽度

height 设置高度

scroll 用于设置滚动条的显示方式

取值：

auto 自动根据内容决定滚动条的显示

yes 无效果

no 永远不显示滚动条

示例：

拓展(了解)

使用JS与iframe实现frameset相同的效果