1. 表格标签
1.1 表格的主要作用
表格主要用于显示、展示数据,可以让数据的显示非常的规整。
1.2 表格的基本语法
表格框架:
代码登录后可见
其中,代码登录后可见是行标签,代码登录后可见是单元格标签,再加上表头单元格标签代码登录后可见。
1.3 表格属性
属性名 | 属性值 | 描述 |
align | left,center,right | 表格元素的对齐方式 |
border | 1 或 "“ | 表格边框有无,默认为 ”" ,表示没有边框 |
cellpadding | 像素值 | 规定单元格之间的空白,默认为 1px |
cellspacing | 像素值 | 规定单元格之间的空白,默认为 2px |
width | 像素值 或 百分比 | 规定表格的宽度 |
1.4 表格结构标签
使用场景:表格可能很长,为了更好的表示表格的语义,可以将表格分割成 表格头部 和 表格主体 两大部分。
在表格标签中,分别使用 代码登录后可见 标签表示表格的头部区域,代码登录后可见 表示表格的主体区域,这样可以更好的分清表格结构。
1.5 合并单元格
合并单元格的方式:
- 跨行合并:rowspan = “合并单元格的个数”。
- 跨列合并:colspan = “合并单元格的个数”。
目标单元格:
- 跨行:最上测单元格为目标单元格,写合并代码。
- 跨列:最左侧单元格为目标单元格,写合并代码。
2. 列表标签
表格是用来显示数据的,列表是用来布局的。
列表最大的特点就是整齐、整洁、有序,用列表布局会更加自由和方便。
根据使用场景的不同,列表可以分为三大类:无序列表、有序列表、自定义列表。
无序列表的基本结构:
代码登录后可见
注意:
- 无序列表各个列表项之间没有顺序级别之分,是并列的。
- 代码登录后可见 中只能嵌套 代码登录后可见 ,在 代码登录后可见 中输入其他标签或文字的做法是不被允许的。
- 代码登录后可见 之间是一个容器,可以容纳任何元素。
有序列表的基本结构:
代码登录后可见
注意:
- 代码登录后可见 中只能嵌套 代码登录后可见 ,在 代码登录后可见 中输入其他标签或文字的做法是不被允许的。
- 代码登录后可见 之间是一个容器,可以容纳任何元素。
- 有序列表带有自己的样式属性,实际使用时可以使用 CSS 设置。
在 HTML 标签中,代码登录后可见 标签用于自定义描述列表(或定义列表),该标签与 代码登录后可见 (定义项目/名字)和 代码登录后可见 (描述每一个项目/名字)一起使用。
自定义列表的基本结构:
代码登录后可见
注意:
- 代码登录后可见 中只能包含 代码登录后可见 或 代码登录后可见。
- 代码登录后可见 和 代码登录后可见个数没有限制,通常是一个代码登录后可见 对应多个代码登录后可见。
3. 表单标签
使用表单的目的是为了收集用户信息
在 HTML 中,一个完整的表单通常由 表单域、表单控件(表单元素)、提示信息 三个部分组成。
3.1 表单域
表单域 是一个包含表单元素的区域。
在 HTML 中,代码登录后可见用于定义表单域。
表单域的基本结构:
代码登录后可见
3.2 表单元素
在表单域中可以定义各种表单元素,这些表单元素就是允许用户在表单中输入或者选择的内容控件。
在 代码登录后可见 标签中,包含一个 type 属性,根据不同的 type 属性值,输入字段拥有很多种形式(如文本、复选框、掩码后的文本控件、单选框、按钮等)。
举例:
代码登录后可见
其中 type 属性的属性值及其描述如下:
属性值 | 描述 |
button | 定义可点击按钮 |
checkbox | 定义复选框 |
file | 定义输入字段和“浏览”按钮,供文件上传 |
hidden | 定义隐藏的输入字段 |
image | 定义图像形式的提交按钮 |
password | 定义密码字段。该字段中的字符被掩码(代码登录后可见) |
radio | 定义单选按钮 |
reset | 定义重置按钮 |
submit | 定义提交按钮 |
text | 定义单行的输入字段,默认宽度为 20 个字符 |
除以上部份外,代码登录后可见标签还可以包括以下的属性:
属性 | 属性值 | 描述 |
name | 自定义 | 定义 input 元素名称 |
value | 自定义 | 规定 input 元素的值 |
checked | checked | 规定此 input 元素首次加载时应当被选中 |
maxlength | 正整数 | 规定输入字段中的字符最大长度 |
注意:
- name 是表单元素的名字,其中 单选按钮 和 复选按钮 必须有相同的 value 值。
- checked 主要针对 单选框 和 复选框,用于默认选择。
代码登录后可见 标签为 input 元素定义标注。
代码登录后可见 标签用于绑定一个表单元素,当点击 代码登录后可见 标签内的文本时,会自动聚焦到对应的表单元素上,增强用户体验。
语法规范:
代码登录后可见
注意:
- 是 代码登录后可见 不是 代码登录后可见 (重要)。
下拉列表,不多解释。
语法规范:
代码登录后可见
注意:
- 代码登录后可见 中至少包含一对 代码登录后可见。
- 在 代码登录后可见 中定义 select = “selected” 时,可以设置当前项为默认项。
多行文本输入,不多解释。
语法规范:
代码登录后可见
注意:
- row 显示几行,cols 每行显示多少字(一般来说,使用 CSS 来实现)。