1 表格标签
案例:小说排行榜
根据前面所学表格标签可以做出下面网页中的小说排行榜案例
04-小说排行榜案例.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<table align="center" border="1" cellpadding="0" cellspacing="0" width="500" height="200">
<tr><th>排名</th><th>关键词</th><th>趋势</th><th>今日搜索</th><th>最近七天</th><th>相关链接</th></tr>
<tr><td>1</td><td>鬼吹灯</td><td>↓</td><td>345</td><td>123</td><td>
<a href="http://jump2.bdimg.com/f?kw=%E9%AC%BC%E5%90%B9%E7%81%AF&ie=utf-8&tab=good" target="_black">贴吧</a>
<a href="https://cn.bing.com/images/search?q=%e9%ac%bc%e5%90%b9%e7%81%af%e5%9b%be%e7%89%87&qpvt=%e9%ac%bc%e5%90%b9%e7%81%af%e5%9b%be%e7%89%87&form=IGRE&first=1&tsc=ImageBasicHover" target="_black">图片</a>
<a href="https://baike.baidu.com/item/%E9%AC%BC%E5%90%B9%E7%81%AF/10790" target="_black">百科</a></td></tr>
<tr><td>2</td><td>盗墓笔记</td><td>↓</td><td>124</td><td>65432</td><td>
<a href="https://jump2.bdimg.com/f?kw=%E7%9B%97%E5%A2%93%E7%AC%94%E8%AE%B0&ie=utf-8&tab=good" target="_black">贴吧</a>
<a href="https://cn.bing.com/images/search?q=%e7%9b%97%e5%a2%93%e7%ac%94%e8%ae%b0%e5%9b%be%e7%89%87&qpvt=%e7%9b%97%e5%a2%93%e7%ac%94%e8%ae%b0%e5%9b%be%e7%89%87&form=IGRE&first=1&tsc=ImageBasicHover" target="_black">图片</a>
<a href="https://baike.baidu.com/item/%E7%9B%97%E5%A2%93%E7%AC%94%E8%AE%B0/21859" target="_black">百科</a></td></tr>
<tr><td>3</td><td>西游记</td><td>↑</td><td>212</td><td>7654</td><td>
<a href="http://jump2.bdimg.com/f?ie=utf-8&kw=%E8%A5%BF%E6%B8%B8%E8%AE%B0&fr=search" target="_black">贴吧</a>
<a href="https://cn.bing.com/images/search?q=%e8%a5%bf%e6%b8%b8%e8%ae%b0%e5%9b%be%e7%89%87&qpvt=%e8%a5%bf%e6%b8%b8%e8%ae%b0%e5%9b%be%e7%89%87&form=IGRE&first=1&tsc=ImageBasicHover" target="_black">图片</a>
<a href="https://baike.baidu.com/item/%E8%A5%BF%E6%B8%B8%E8%AE%B0/5723" target="_black">百科</a></td></tr>
<tr><td>4</td><td>东游记</td><td>↑</td><td>23</td><td>75645</td><td>
<a href="http://jump2.bdimg.com/f?ie=utf-8&kw=%E4%B8%9C%E6%B8%B8%E8%AE%B0&fr=search" target="_black">贴吧</a>
<a href="https://cn.bing.com/images/search?q=%E4%B8%9C%E6%B8%B8%E8%AE%B0%E5%9B%BE%E7%89%87&qs=n&form=QBIR&sp=-1&pq=dong%E6%B8%B8%E8%AE%B0%E5%9B%BE%E7%89%87&sc=0-8&cvid=AFC63EA04447491D8F4A5EFCDF6F5EC6&first=1&tsc=ImageBasicHover" target="_black">图片</a>
<a href="https://baike.baidu.com/item/%E4%B8%9C%E6%B8%B8%E8%AE%B0/15083" target="_black">百科</a></td></tr>
<tr><td>5</td><td>甄嬛传</td><td>↓</td><td>121</td><td>7676</td><td>
<a href="http://jump2.bdimg.com/f?ie=utf-8&kw=%E7%94%84%E5%AC%9B%E4%BC%A0&fr=search" target="_black">贴吧</a>
<a href="https://cn.bing.com/images/search?q=%E7%94%84%E5%AC%9B%E4%BC%A0%E5%9B%BE%E7%89%87&qs=n&form=QBIR&sp=-1&pq=zhen%27huan%27z%E5%9B%BE%E7%89%87&sc=0-13&cvid=4744640D05B248AB93F60B23D252EDFB&first=1&tsc=ImageBasicHover" target="_black">图片</a>
<a href="https://baike.baidu.com/item/%E7%94%84%E5%AC%9B%E4%BC%A0/4701562" target="_black">百科</a></td></tr>
<tr><td>6</td><td>水浒传</td><td>↑</td><td>576576</td><td>1231412</td><td>
<a href="http://jump2.bdimg.com/f?ie=utf-8&kw=%E6%B0%B4%E6%B5%92%E4%BC%A0&fr=search" target="_black">贴吧</a>
<a href="https://cn.bing.com/images/search?q=%E6%B0%B4%E6%B5%92%E4%BC%A0%E5%9B%BE%E7%89%87&qs=n&form=QBIR&sp=-1&pq=%E6%B0%B4%E6%B5%92%E4%BC%A0%E5%9B%BE%E7%89%87&sc=8-5&cvid=B72EF8478EDE4C4D98D710CB0CB2CE8D&first=1&tsc=ImageBasicHover" target="_black">图片</a>
<a href="https://baike.baidu.com/item/%E6%B0%B4%E6%B5%92%E4%BC%A0/348" target="_black">百科</a></td></tr>
<tr><td>7</td><td>三国演义</td><td>↑</td><td>234</td><td>7686</td><td>
<a href="http://jump2.bdimg.com/f?ie=utf-8&kw=%E4%B8%89%E5%9B%BD%E6%BC%94%E4%B9%89&fr=search" target="_black">贴吧</a>
<a href="https://cn.bing.com/images/search?q=%E4%B8%89%E5%9B%BD%E6%BC%94%E4%B9%89%E5%9B%BE%E7%89%87&qs=n&form=QBIR&sp=-1&pq=san%27guo%27yan%27yi%E5%9B%BE%E7%89%87&sc=0-16&cvid=CD66661AEFBE4232932DB9884BA01DF2&first=1&tsc=ImageBasicHover" target="_black">图片</a>
<a href="https://baike.baidu.com/item/%E4%B8%89%E5%9B%BD%E6%BC%94%E4%B9%89/5782" target="_black">百科</a></td></tr>
</table>
</body>
</html>
上述链接可使用外部链接
eg:< a href="http:// w ww.baidu.com ">百度< /a >
或者空链接
eg:< a href="#">首页< /a >
网页显示:
点击链接跳转:
本文链接:https://blog.csdn.net/weixin_51249285/article/details/121151390