链接元素和表格
链接元素
链接元素<a href=""></a>
1、链接网页
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>链接元素-链接网页</title>
</head>
<body>
<a href="https://www.php.cn">我是一个链接,链接到网页</a>
</body>
</html>
2、跳转到邮箱
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>链接元素-链接邮箱</title>
</head>
<body>
<a href="mailto:123456@qq.com">我是一个链接,链接到邮箱</a>
</body>
</html>
3、跳转到电话
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>链接元素-链接电话</title>
</head>
<body>
<a href="tel:18012345678">我是一个链接,链接到电话</a>
</body>
</html>
4、跳转到本页面的锚点
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>链接元素-跳转锚点</title>
</head>
<body>
<a href="#anchor">我是一个链接,跳转锚点</a>
<div id="anchor">我是锚点</div>
</body>
</html>
表格
看下面的商品信息表格
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>表格</title>
</head>
<body>
<table border="1" width="700" cellspacing="0" cellpadding="10" align="center">
<caption style="font-size: 1.5rem; margin-bottom: 10px">
商品信息表
</caption>
<thead>
<th>ID</th>
<th>分类</th>
<th>名称</th>
<th>单价</th>
<th>数量</th>
<th>总价</th>
</thead>
<tbody>
<tr>
<td>1000</td>
<td rowspan="2">电子产品</td>
<td>笔记本</td>
<td>5500</td>
<td>2</td>
<td>11000</td>
</tr>
<tr>
<td>1001</td>
<!-- <td>电子产品</td> -->
<td>手机</td>
<td>3000</td>
<td>3</td>
<td>9000</td>
</tr>
<tr>
<td colspan="6" style="text-align: center;">分割一下</td>
</tr>
<tr>
<td>1002</td>
<td rowspan="2">家用电器</td>
<td>电视机</td>
<td>2000</td>
<td>1</td>
<td>2000</td>
</tr>
<tr>
<td>1003</td>
<!-- <td>家用电器</td> -->
<td>空调</td>
<td>1500</td>
<td>2</td>
<td>3000</td>
</tr>
<tr>
<td colspan="6" style="text-align: center;">分割一下</td>
</tr>
<tr>
<td>1004</td>
<td>服装</td>
<td>牛仔裤</td>
<td>120</td>
<td>2</td>
<td>240</td>
</tr>
</tbody>
</table>
</body>
</html>