w3school 在线教程
1. 表格标签
【作用】表格用来显示展示数据,可读性好。
【基本语法】
- <table></table>定义表格标签
- <tr></tr>定义表格中的行,嵌套在table标签里
- <td></td>定义单元格,嵌套在tr标签里
2. 表头单元格标签
文本加粗居中显示,位于表格第一行或者第一列
<th></th>标签表示表头部分
3. 表格属性(了解)
后面会通过CSS来设置 ;属性需要写到table标签里面
4. 表格结构标签
【作用】将表格分成头部和主体两个部分
<thead>表示头部区域,内部必须要有<tr>,<tbody>表示主体区域,放数据本体。这两个标签都放在<table>里。
5. 合并单元格
【作用】把多个单元格合并成一个
【方式】
- 跨行合并:rowspan = "合并单元格的数量"
- 跨列合并:colspan = "合并单元格的数量"
【目标单元格】
- 跨行:最上侧为目标单元格,写合并的代码
- 跨列:最左侧为目标单元格
6. 列表标签
【作用】布局,整齐、有序
【类别】无序、有序、自定义列表
7. 无序列表
<ul>表示项目中的无序列表,<li>定义列表项
【注】
- 无序列表是没有顺序的,各项是并列的
- ul标签里只能放li标签
- li标签里可以放任何元素
8. 有序列表(理解)
<ol>定义有序列表,列表项还是<li>
【注】
- ol标签里只能放li标签
- li标签里可以放任何元素
9. 自定义列表(重点)
【场景】通常对术语或者名词进行描述,项前面没有符号
【语法】<dl>定义列表,<dt>定义项目/名字,<dd>定义每一个项目/名字。语法如下:
【注】
- <dl>标签里只能放<dt>和<dd>标签
- <dt>和<dd>没有数量限制,通常是一个dt对应多个dd
10. 表单标签
【作用】收集用户信息,跟用户交互
【组成】表达域,表达控件,提示信息
11. 表单域
<form>定义表单域,将信息提供给服务器,语法如下:
目前只需要写上form标签
12. 表单控件--input输入表单元素
<input>标签用于收集用户信息,包含一个type属性,不同的属性值指定不同的控件类型
<input>是单标签
【注】
- 单选按钮/复选按钮要有相同的name属性
- name和value属性是每个表单都有的属性,主要给后台人员看
- checked一打开就默认选中元素,主要针对按钮
13. <label>标签
<label>用于绑定一个表单元素,当点击标签内的文本时,光标就能定位到对应的表单元素上,增加用户体验。语法如下:
【注】label的for属性要与对应元素的id属性相同
14. 表单控件--select下拉表单元素
定义下拉列表,有多个选择,也可以节省空间。语法如下:
【注】
- select里至少要包括一个option
- 在option里定义selected=selected,默认为选中状态
15. 表单控件--textarea文本域表单元素
当输入内容较多的时候,需要使用文本域。<textarea>定义多行输入的控件,语法如下:
cols是每行的字符数,rows是行数。开发中用CSS改变大小