(9月8日学习笔记） 表单和表格相关标签、属性补充

表单和表格补充

fieldset标签和legend标签

<fieldset>标签的定义和使用
fieldset元素可将表单的相关元素分组。
fieldset标签将表单内容的一部分打包，生成一组相关表单的字段。
当一组表单元素放到<fieldset>标签内时，浏览器会以特殊的方式来显示它们，它们可能有特殊的边界，3D效果，或者甚至可以穿件一个子表单来处理这些元素。

<legend>标签的定义和使用
legend元素表示作为legend元素的父元素fieldset元素的其余内容标题（caption）。
legend元素作为fieldset元素的第一个子元素来使用。
legend标签为fieldset元素定义标题。

//组合表单中的相关元素
<form>
    <fieldset>
        <legend>健康信息</legend>
        身高:<input type="text"/>
        体重:<input type="text"/>
    </fieldset>
</form>

lable标签

<label> 标签为 input 元素定义标注（标记）。
label 元素不会向用户呈现任何特殊效果。不过，它为鼠标用户改进了可用性。如果您在 label 元素内点击文本，就会触发此控件。就是说，当用户选择该标签时，浏览器就会自动将焦点转到和标签相关的表单控件上。
<label> 标签的 for 属性应当与相关元素的 id 属性相同。

file标签

multiple作用：多选
<input type="file" multiple="multiple"/>

表格元素补充

th列标题
HTML 表单中有两种类型的单元格：
表头单元格 - 包含表头信息（由 th 元素创建）
标准单元格 - 包含数据（由 td 元素创建）
th 元素内部的文本通常会呈现为居中的粗体文本（水平，垂直都居中），而 td 元素内的文本通常是左对齐的普通文本

rules标签
rules 属性规定内侧边框的哪个部分是可见的。
从实用角度出发，最好不要规定 rules，而是使用 CSS 来添加边框样式。

thead tbody tfoot

<thead> 标签定义表格的表头。该标签用于组合 HTML 表格的表头内容。
thead 元素应该与 tbody 和 tfoot 元素结合起来使用。
tbody 元素用于对 HTML 表格中的主体内容进行分组，而 tfoot 元素用于对 HTML 表格中的表注（页脚）内容进行分组。
注释：如果您使用 thead、tfoot 以及 tbody 元素，您就必须使用全部的元素。它们的出现次序是：thead、tfoot、tbody，这样浏览器就可以在收到所有数据前呈现页脚了。您必须在 table 元素内部使用这些标签。
提示：在默认情况下这些元素不会影响到表格的布局。不过，您可以使用 CSS 使这些元素改变表格的外观。

colgroup标签

<colgroup> 标签用于对表格中的列进行组合，以便对其进行格式化。
如需对全部列应用样式，<colgroup> 标签很有用，这样就不需要对各个单元和各行重复应用样式了。
<colgroup> 标签只能在 table 元素中使用。

注意：字母和数字在程序的解析中，不会自动换行

tableLayout 属性用来显示表格单元格、行、列的算法规则。

border-spacing 属性设置相邻单元格的边框间的距离（仅用于“边框分离”模式）。

border-collapse属性

border-collapse 属性设置表格的边框是否被合并为一个单一的边框

奇数和偶数

even 偶数 2n   odd 奇数 2n+1

网页状态栏图标

<link rel="shortcut icon" href="favicon.ico" /> 

序列选择器

选中同级别的第几个标签，不同类型的标记不能被选中，中间不能被其他标签隔开，同级别其实就是标签的兄弟关系
注意点：最好不要把序列选择器使用在元素的最外层，要做限定，不要省略掉
css3 nth-child选择器
p:nth-child(n) // 选择属于其父元素的第n个子元素的每个 <p> 元素
p:nth-child(2n) // 选择属于其父元素的子元素的每个偶数<p> 元素
p:nth-child(2n + 1) // 选择属于其父元素的子元素的每个奇数<p> 元素
比如查找第一个元素
:nth-child(1)
查找序列大于等于10的元素
:nth-child(n+10)
:first-child // 第一个元素
:last-child    // 最后一个元素
:nth-last-child // 从最后一个子元素开始计数，n还是0开始，但是子元素的最后一个是1，倒过来了
:first-of-type  选中同类型的第几个标记，只认同类型的标记，其他类型的标记不识别，可以被隔开
:only-child 选中父元素中的唯一一个标记