HTML笔记

8.7

1.标签释义

1.1.table标签：

tr表示每一行，td表示每一行的单元格，除此之外第一行的单元格可以使用th来表示表头，会有字体加粗的默认效果。表格有几个属性，分别是cellpadding（单元格内的空间）、cellspacing（单元格之间的空间）、valign（内容垂直对齐方式），rowspan（合并列方向单元格）、colspan（合并行方向单元格），注意：合并单元格时只能左下方向合并，不能右上方向合并。除tr，td，th还有thead、tbody、tfoot表示表头区域，主题区域，结尾区域，没有任何特殊样式，仅仅是划分区域的标记，除此之外没有任何实际意义。

<table>
    <tr>
        <th>表头</th>
        <th>表头</th>
        <th>表头</th>
    </tr>
    <tr>
        <td>普通单元格</td>
        <td>普通单元格</td>
        <td>普通单元格</td>
    </tr>
    <tr>
        <td>普通单元格</td>
        <td>普通单元格</td>
        <td>普通单元格</td>
    </tr>
</table>

1.2.form标签：

也称为表单标签，用在页面收集数据后向后台发送请求的时候，里面一般分为三部分，表单标签，表单域，表单按钮

<form>表单标签</form>

1.3.input标签：

主要显示为标签内的type属性值，type不同，每个属性所代表的意义都有所区别，比较繁杂

<input></input>

1.4.label标签：

主要作用是将标签内的文字通过for属性与按钮绑定在一起

<label></label>

1.5.select和optgroup标签：

下拉框，optgroup表示下拉框的每一类，option表示下拉框内显示的每一项属性，option必须嵌套在optgroup或select中。select标签的name属性表示下拉框的名称，size表示下拉框可现实多少行内用。optgroup标签中的label属性表示分组名称。option标签中的value值表示返回值

<select>
 <optgroup>
   <option>选项</option>
 </optgroup>
</select>

1.6.textarea标签：

也被称为多行文本框，name属性值为标签的名称，cols属性值表示最多显示多少列内容，rows属性值表示最多显示多少行

<textarea></textarea>

2.input标签内不同type值所展现的不同属性及其解释

2.1.当type=text时

当type属性值为text时，所展现的为文本框。

1.size属性代表文本框的长度

2.maxlength属性代表文本框内内容的最大长度

3.placeholder代表文本框内所提示的文字内容，用户点击后会消失不见

4.value代表文本框内默认的，真实的可以被返回的文本用户点击后需要删除

5.name值代表此文本框的名称，如果有多个文本框每一个都是独立的个体名字各不相同

2.2.当type=password时

当type属性值为password时，所展现的为密码框。此时密码框内的文本会被*遮挡看不到真实内容

1.size属性代表文本框的长度

2.maxlength属性代表文本框内内容的最大长度

3.name代表此文本框的名称

2.3.当type=checkbox时

当type属性值为checkbox时，所展现的为复选框。此时每一个checkbox代表一个复选框

1.同一项目的多个复选框name值应该一样且后面跟" [ ] "，表示传递回去的是一组数据，如果不加会传回多个值后面的值会覆盖前面的值

2.value代表传回的值

3.id值与label标签中的for属性值一样表示将label标签中的文字与复选框绑在一起点击文本时复选框也会一并选中或取消

2.4.当type=radio时

当type属性值为radio时，所展现的为单选框。此时每一个radio代表一个单选框

1.name属性值相同时代表是同一组按钮，同一组按钮无论都多少都只会选中一个

2.checked属性的默认值为checked，表示默认选中，当属性和属性值一样时，可只写属性值

3.value代表传回的值

4.id值与label标签中的for属性值一样表示将label标签中的文字与单选框绑在一起点击文本时单选框也会一并选中同时同一按钮组的被选中按钮会取消

2.5.当type=file时

当type=file时，会选择一个文件并通过按钮提交

1.name值代表此浏览框的名称

2.6.当type=hidden时

当type=hidden时，页面不会显示内容但是会随着提交按钮的提交也一并提交

1.name值代表此隐藏域的名称

2.3.value值代表传回的值

3.按钮

按钮分为三种分别是：提交（type=submit），重置（type=reset）和普通按钮（type=button），三种按钮使用的场景不大相同

普通按钮配合js完成⼀些操作

重置按钮重置表单数据 有默认的按钮标题。

提交按钮提交表单