1、转义字符
<——“小于号” >——“大于号” ——“空格” ©——版权符号©
2、注释
快捷键:ctrl+/
3、列表标签
3.1 有序列表——<ol><li></li></ol>
注意:
- `<ol>` 标签中只能放`<li>` 标签;
- `<li>` 标签中可以放任何东西。
3.2 无序列表——<ul><li></li></ul>
注意:
- `<ul>` 标签中只能放`<li>` 标签;
- `<li>` 标签中可以放任何东西。
3.3 定义列表——<dl></dl>
只要语义上有`解释说明`含义的文字,且为列表形态,应该使用定义列表
4、表格标签![](https://i-blog.csdnimg.cn/blog_migrate/d4e02d81e1f15fa8f895c37112b6e016.png)
- table标签:表格整体
- tr标签:表格每行
- td标签:对于主题的每一项内容
标签的嵌套关系:table > tr > td
4.1表格的属性(后面通过 CSS 来设置)
4.2 table 的 caption 属性
caption 是表格的标题,它常常作为 table 的第一个子元素出现
可以设置宽高, 和图片一样, width 设置宽, height 设置高
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<table border="1" width="500" height="200">
<caption>
标题
</caption>
<tr>
<td>A</td>
<td>B</td>
<td>C</td>
<td>D</td>
</tr>
</table>
</body>
</html>
4.3 th 标签
<th>
是标题小格
,可以替代 <td>
,表示一列的标题
4.4 单元格的合并
colspan 属性——用来设置 td 或者 th 的列跨度
rowspan 属性——用来设置 td 或者 th 的行跨度
4.5 thead、tbody、tfoot 标签
- thead 标签定义表头
- tbody 标签定义表核心内容
- tfoot 标签定义表脚,通常是汇总行
5、表单
- 表单用来收集信息,比如注册、登录、发送评论反馈、购买商品等等
- 所有 HTML 表单都以一个
<form>
元素开始 - 在 HTML 中,一个完整的表单通常由表单域、表单控件(也称为表单元素)和 提示信息3个部分构成。
5.1 <input> 表单元素
type 属性的属性值及其描述如下:
除 type 属性外,<input>标签还有其他很多属性,其常用属性如下:
- name 和value 是每个表单元素都有的属性值,主要给后台人员使用.
- name 表单元素的名字, 要求单选按钮和复选框要有相同的name值.
- checked属性主要针对于单选按钮和复选框, 主要作用一打开页面,就要可以默认选中某个表单元素.
- maxlength 是用户可以在表单元素输入的最大字符数, 一般较少使用.
5.2 <label> 标签
- <label> 标签为 input 元素定义标注(标签)。
- <label> 标签用于绑定一个表单元素, 当点击<label> 标签内的文本时,浏览器就会自动将焦点(光标)转到或者选择对应的表单元素上,用来增加用户体验.
语法:
<label for="sex">男</label>
<input type="radio" name="sex" id="sex" />
核心: <label> 标签的 for 属性应当与相关元素的 id 属性相同。
5.3 表单控件(表单元素)
1、input输入表单元素
<input type="属性值" />
2、select下拉表单元素
<select>
<option>选项1</option>
<option>选项2</option>
<option>选项3</option>
...
</select>
- <select> 中至少包含一对<option> 。
- 在<option> 中定义 selected =“ selected " 时,当前项即为默认选中项。
3、textarea 文本域元素
<textarea rows="3" cols="20">
文本内容
</textarea>
- 通过 <textarea> 标签可以轻松地创建多行文本输入框。
- cols=“每行中的字符数” ,rows=“显示的行数”,我们在实际开发中不会使用,都是用 CSS 来改变大小。
6、 表单元素总结
- 表单元素我们学习了三大组 input 输入表单元素、 select 下拉表单元素、 textarea 文本域表单元素.
- 这三组表单元素都应该包含在form表单域里面,并且有 name 属性.
<form>
<input type=“text " name=“username”>
<select name=“jiguan”>
<option>北京</option>
</select>
<textarea name= "message"></textarea>
</form>
- 表单域 form 使用场景: 提交区域内表单元素给后台服务器
- 文件域 file 是input type 属性值 使用场景: 上传文件
- 文本域 textarea 使用场景: 可以输入多行文字, 比如留言板 网站介绍等…