目录
一、文本标签
1. 单标签
<html></html> 网页框架标签
<title></title> 网页标题标签
<body></body> 主题标签
<h1></h1> 一级标题标签
<p></p> 段落标签
2. 双标签
<br> 换行标签
<hr> 水平分割线
3. 重要的信息往下面放（自行判断）
<strong></strong> 加粗
<ins></ins> 下划线
<em></em> 倾斜
<del></del> 删除线
4. 不重要的信息往下面放（自行判断）
<b></b> 加粗
<u></u> 下划线
<i></i> 倾斜
<s></s> 删除线
二、图片标签
<img src=" " alt=" " title=" " width=“ ” height=“ ” >(里面可有多个属性)
src:图片路径
alt:替换文本，当图片不显示时显示
title:提示文本，当鼠标悬停时显示
width：图片宽度
height：图片高度
（设置宽高时只设置宽或者高时另一个高或者宽会等比例设置，目的是使图片不变形）
三、路径
1. 绝对路径
例如：
盘符开头：D:\day01\images\1.jpg
完整的网络地址：http://www.itcast.cn/2018czgw/images/logo.gif(了解)
2.相对路径
(1) 同级目录：
方法一：<img src="目标图片.gif">
方法二：<img src="./目标图片.gif">
(2) 下级目录：
<img src="images/目标图片.gif">
(3) 上级目录
<img src="../images/目标图片.gif">
四、音频标签
例如：<audio src="./music.mp3" controls autoplay loop></audio>
src：音频的路径
controls：显示播放控件
autoplay：自动播放（部分浏览器不支持）
loop：循环播放
五、视频标签
例如：<video src="./video.mp4" controls autoplay muted loop></video>
src：视频的路径
controls：显示播放控件
autoplay：自动播放（谷歌浏览器中需配合muted实现静音播放）
loop：循环播放
六、链接标签
例如：<a href="./目标网页.html" target="_blank">超链接</a>
(开发网站初期，还不知道跳转地址的时候，href的值书写#(空链接) --)
1. target：
_self 默认值，在当前窗口中跳转（覆盖原网页）
_blank 在新窗口中跳转（保留原网页）
七、列表标签
1. 无序列表
ul 表示无序列表的整体，用于包裹li标签
li 表示无序列表的每一项，用于包含每一行的内容
特点：列表的每一项前默认显示圆点标识
注：
- ul标签只允许包含li标签
- li标签可以包含任意内容
2.有序列表
ol 表示有序列表的整体，用于包裹li标签
li 表示有序列表的每一项，用于包含每一行的内容
特点：列表的每一项前默认显示序号标识
注：
- ol标签只允许包含li标签
- li标签可以包含任意内容
3.自定义列表标签
dl：表示自定义列表的整体，用于包裹dt/dd标签
dt：表示自定义列表的主题
dd：表示自定义列表的针对主题的每一项内容
例如：
特点：
- dd前会默认显示缩进效果
注意：
- dl标签中只允许包含dt/dd标签
- dt/dd标签可以包含任意内容
八、表格标签
1.表格的基本标签
例如：
效果：
注意：实际开发时针对于样式效果推荐用css设置
2.表格标题和表头单元格标签
例：
效果：
注意：
- caption标签书写在table标签内部
- th标签书写在tr标签内部（用于替换td标签）
3.表格的结构标签（了解）
作用：让表格内容结构分组，突出表格的不同部分（头部、主体、底部），使语义更加清晰
thead：包裹表格头部
tbody：包裹表格主体
tfoot：包裹表格底部
4.合并单元格
- 上下合并-->只保留最上的，删除其他
- 左右合并-->只保留最左的，删除其他
例：
效果：
注意：只用同一个结构标签中的单元格才能合并，不能跨结构标签合并（不能跨thead、tbody、tfoot）
九、表单标签
1. input标签
- input标签可以通过type属性值的不同，展示不同的效果
例：
效果：
1.2.input系列标签-文本框
例：
效果：
1.4.input系列标签-单选框
例：
效果：
1.6input系列标签-文件选择
例：
1.7input系列标签-按钮
注意：
- 如果需要实现以上按钮功能，需要配合form标签使用
- form使用方法：用form标签把表单标签一起包裹起来即可
例：
效果：
2. button按钮标签
注意：
- 谷歌浏览器中button默认是提交按钮
- button标签是双标签，更便于包裹其他内容：文字、图片等
例：
效果：
3. select下拉菜单标签
例：
效果：
4. textarea文本域标签
注意：
- 右下角可以拖拽改变大小
- 实际开发时针对于样式效果推荐用css设置
例：
效果：
5. label标签
使用label标签点击选择标签时可以直接点击内容
例：
十、语义化标签
10.1没有语义的布局标签
例：
效果：
10.2有语义的布局标签（了解）（移动端手机网页常用）
注：以上标签显示特点和div一致，但是比div多了不同的语义
例：
效果：
十一、字符实体
例：
（直接敲空格浏览器只能识别一个空格，需要多个空格时用字符实体）
效果：
111
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
