img常见属性
<img src=" " alt="">
src指的是图片的路径url
alt属性。表示图片的替代文本（图片因为路径错误或者其他问题在浏览器显示不出来会让浏览器显示来替代这个文本
<img src="1.png" alt="一张图" width="" hight="" boder="1" >
boder.边框，默认是0 （没边框）>=1有，越大越宽
**align:**图片位置
上对齐align="top"
居中对齐align="center"
下对齐align="bottom"
默认对齐align=""
右对齐align="right"
**title：**图片的标题，用来描述图片的文字
<img src="1.png" alt="一张图" width="" hight="" title="一张" >
位图
usemap将图片定义为客户端图片的映射,当使用href点击跳转到1.html时,需要先用usemap="图片名字"将图片连接
usemap需要结合map和area两个标签使用
shape是表示鼠标点击的形状
coords是鼠标打击的形状大小的取值
href表示的是要跳转的路径
<img src="1.png" alt="一张图" width="" hight="" usemap="#image" >
<map name="image">
<area shape="circle" coords="400,450,30" href="1.html" >
</map>
多媒体标签
视频标签video
音频标签audio
常见属性：
src表示视频或音频的位置（相对路径或者绝对路径）和img标签一样去使用
controls表示的播放器的组件（视频一般肯定要显示的，但音频可以选择，如果是背景音乐可以不用显示）
autoplay表示自动播放（后续可以通过js来进行实现自动播放）
<audio src="../img/wang.mp3" controls autoplay></audio>
表格布局
表格在网页制作中
<tr>表示行
<td>表示列,也叫单元格，必须放在tr标签内
tbody表示定义表格的主干
tfoot是表格的表尾
表格属性
1.边框用border实现
2.width表格宽度 height表格高度
3.表格对齐需要align 有left right center
4.表格背景：
背景颜色bgcolor="red"
背景图片background="1.png"
5.表格的间距和边距：
边距：
cellpadding ------ 指的是单元格内的元素距离单元格边缘的距离
间距：cellspacing ------ 表示单元格和单元格之间的距离
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<table width="300" border="1" cellpadding="10" cellspacing="20">
<tr>
<td>第一行第一列</td>
<td>一行第二列</td>
</tr>
<tr>
<td>第二行第一列</td>
<td>第二行第二列</td>
</tr>
</table>
</body>
</html>cellpadding="10"表示的是边距为10px cellspacing="20" 表示间距是20px
如果不设置这两个值，它们的默认值为2px
<table width="300" border="1" cellpadding="0" cellspacing="0">
<tr>
<td>第一行第一列</td>
<td>一行第二列</td>
</tr>
<tr>
<td>第二行第一列</td>
<td>第二行第二列</td>
</tr>
</table>
|--------|--------|
| 第一行第一列 | 一行第二列 |
| 第二行第一列 | 第二行第二列 |
注意：表格内的tr和td也可以设置宽和高以及背景颜色
<table width="300px" border="1">
<tr height="30px" bgcolor="#cccccc">
<td> </td>
<td> </td>
</tr>
<tr height="40px" bgcolor="#999999">
<td> </td>
<td> </td>
</tr>
<tr height="60px" bgcolor="#666666">
<td> </td>
<td> </td>
</tr>
</table>表格的嵌套
将一个表格放到另一个表格的单元格中，可以用来布局
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<table width="300" border="1">
<tr>
<td> </td>
<td>
<table width="100px" border="1" align="center">
<tr>
<td> </td>
<td> </td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
表格的合并
单元格跨行、跨列（合并行和合并列）
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!-- <table width="300" border="1">
<tr>
<td rowspan="2"> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
</table> -->
<table width="300" border="1">
<tr>
<td colspan="2" align="center">XXX班级的成绩</td>
</tr>
<tr>
<td align="center">笔试</td>
<td align="center">机试</td>
</tr>
<tr>
<td align="center">98</td>
<td align="center">90</td>
</tr>
</table>
</body>
</html>rowspan="2" 表示的是在单元格垂直方向跨的行数（合并行）
colspan="2" 表示的是在单元格水平方向跨的是列数（合并列）