- 1 图像
- 1.1 图像标签
- 1.2 使用方法
- 1.3 Alt属性
- 1.4 高度和宽度
- 1.5 举例
- 1.6 总结
- 2 表格
- 2.1 表格标签
- 2.2 边框属性
- 2.3 表格表头
- 2.4 表格示例
- 3 列表
- 3.1 有序、无序列表
- 3.2 列表标签
- 4 区块
- 4.1 区块元素
- 4.2 内联元素
- 4.3 div元素
- 4.4 span元素
- 4.5 举例
- 图像由 标签定义；
- 是空标签，只包含属性，并且没有闭合标签；
- 需要使用源属性（src），页面上才能显示图像，其值是图像的 URL 地址；
| 标签 | 说明 |
|---|---|
| 定义图像 | |
| 定义图像地图 | |
| 定义图像地图中的可点击区域 |
1.3 Alt属性
- 用来为图像定义一串预备的可替换的文本；
- 文本的内容用户自定义；
- 作用：浏览器无法载入图像时，就会显示替换文本，这样很容易知道错误信息。
- 使用height（高度 与 width（宽度）进行设置；
- 属性值默认单位为像素；
- 使用方法：
- 建议对图像的宽度和高度进行设置，这样便于图片显示，而不打乱页面布局；
图像学习
1、图像居中、底部对齐(vertical-align: middle、bottom)：
鹿柴-王维〔唐代〕
空山不见人，
但闻人语响。
返景入深林，复照青苔上。
2、图像顶部对齐、居中(vertical-align: middle、top)：
送别-王维〔唐代〕
山中相送罢，
日暮掩柴扉。
春草明年绿，
王孙归不归？
3、图像浮动在段落左边、右边(float: left、right)：
春晓-孟浩然〔唐代〕
春眠不觉晓，
处处闻啼鸟。
夜来风雨声，
花落知多少。
4、图像链接(a herf)-无、有边框：
5、点击图片中的对应区域：
- 关于图像映射标签;
| shape | coords |
|---|---|
| rect(矩形) | 矩形左上角和右下角的坐标 |
| circle(圆形) | 圆心的坐标和半径 |
| poly(多边形) | 规定多边形各顶点坐标 |
- 由
标签来定义；
- 每个表格均有若干行（由
标签定义）； - 每行被分割为若干单元格（由
标签定义）； - 数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等；
- 举例：
表格学习
2.2 边框属性r1, c1 r1, c2 r2, c1 r2, c2 - 如上2.1的代码，使用了border来设置边框；
- border的值从0开始，值越大，边框越粗；
- 以下border的值为1，5，20；
2.3 表格表头
- 使用
标签进行定义； - 举例：
表格学习
2.4 表格示例项目 说明 r1, c1 r1, c2 r2, c1 r2, c2 - 示例1：
表格学习 1、有边框
项目 说明 r1, c1 r1, c2 r2, c1 r2, c2 2、无边框
项目 说明 r1, c1 r1, c2 r2, c1 r2, c2 3、设置标题
成绩单 姓名 科目 分数 隔壁老王 数学 100 草根小李 语文 100 4、单元格跨行扩列，类似合并
成绩单 姓名 科目和分数 隔壁老王 数学 100 草根小李 语文 100 剑神无名 剑气 100 武力 99 - 示例2：
表格学习 表格内标签
- 每个表格均有若干行（由
