图片标签:
img src:title属性是当鼠标移动到图片上面时显示一段文字
alt属性是当找不到图片路径时在图片的相关位置显示相应的文字
style属性可以调整图片格式
---简单实例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<a href="https://zhishitu.com" style="color: #800000;">"http://www.baidu.com">
<img src="1.png" title="屏幕截图" style="height:200px;width:200px;" alt="屏幕截图"> <!--点击图标跳转到相应的网页-->
</a>
</body>
</html>
列表标签:
1.ul-li相互对应(符号为首)
<ul>
<li>xxx</li>
<li>sxx</li>
</ul>
2.ol-li相互对应(有序数字为首)
<ol>
<li>xxx</li>
<li>aaa</li>
</ol>
3.dl-dt,dl-dd三者关联(dt是标题,dd是dt下的内容)
<dl>
<dt>广东</dt>
<dd>汕头</dd>
<dd>惠州</dd>
<dt>福建</dt>
<dd>莆田</dd>
<dd>其他</dd>
</dl>
表格标签:
tr-td相互对应,tr表示一行,td表示一行中的列内容,th表示表头的列
border属性是添加表格样式
可以搭配a标签使用
---示例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<table border="1">
<thead> 表头的专用标签
<tr> 一行的表头有4个属性,注意是th标签
<th>表头1:</th>
<th>表头1:</th>
<th>表头1:</th>
<th>表头1:</th>
</tr>
</thead>
<tbody> 表格除表头外所用的标签
<tr>
<td>第二行,第一列</td>
<td>
<a href="https://zhishitu.com" style="color: #800000;">"http://www.baidu.com">第二行,第二列</a>
</td>
<td colspan="2">第二行,第三列</td> colspan从该列开始往右合并2个单元格
<td>第二行,第四列</td>
</tr>
<tr>
<td>第三行,第一列</td>
<td>
<a href="https://zhishitu.com" style="color: #800000;">"http://www.baidu.com">第三行,第二列</a>
</td>
<td rowspan="2">第三行,第三列</td> colspan从该列开始往下合并2个单元格
<td>第三行,第四列</td>
</tr>
</tbody>
</table>
</body>
</html>
label标签:
<label for="username">用户名:</label> <!--用意是,当点击用户名也可以自动跳转到输入框-->
<input id="username" type="text" name="user">
知识兔