HTML学习之路-第四天

1.表单标签

（1）表单的作用：收集用户信息

（2）表单元素：比较特殊的HTML标签

（3）格式：<form>

                                  <表单元素>

                    </form>

2.常见的表单元素：

（1）input标签：<input type="数据类型">

-数据类型可以为：text<明文输入>

                              password<暗文输入>

                              radio<单选框，单选框默认不互斥，所以需要设置name属性，默认选项将属性写为checked>、

                              checkbox<多选框>

                             button<按钮，配合js进行操作>

                             image<图片按钮>

                             reset<清空填写的信息>

                             submit<向服务器提交数据，需要给form表单添加action属性，通过这个属性提交到指定服务器，再给需要提交到服务器的表单元素添加一个name属性>

                             hidden<隐藏域，不被用户知晓的情况下将数据提交到服务器>

-value属性：输入框内的默认值

-在HTML5中新增的数据类型（浏览器不一定支持）：email<邮箱的特定格式>、url<网址的特定格式>、number<电话号码的特定格式>、data<选择时间>、color<选择颜色>

2.label标签

（1）作用：让点击的文字与对应的8输入框进行聚焦

（2）用法：

-把文字写入<label>...</label>标签，并给<input>标签加入id属性，然后用for属性将label标签与input标签关联（官方推荐）

-直接将文字与input标签写入label标签

3.DataList标签（HTML5）

（1）作用：给输入框绑定待选项（非常多的浏览器不支持）

（2）格式：<datalist>

                                   <option>待选项内容</option>

                    </datalist>

4.select标签

（1）作用：定义下拉列表

（2）格式：<select>

                                 <option>列表数据</option>

                    </select>

（3）列表数据分类：将<option>...</option>写入<optgroup label="类别的名称">...</optgroup>中进行分类

5.textarea标签

（1）作用：定义一个多行的输入框，可以无限输入且可以拉伸高度与宽度

（2）格式：<textarea>

                    </textarea>

（3）属性：cols（宽度）、rows（高度）