我们在浏览网页时,为了提高信息的检索速度,会用到HTML语言中的一种特殊链接——锚点链接.通过创建锚点链接,用户可以快速定位到目标内容.
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <!-- 返回顶部(反向使用锚点) <a name="top"></a> <a href="#top">返回顶部</a>--> <a name="top"></a> <!-- 超链接跳转转到指定锚点 <a href="#id名">链接文本</a> 定义锚点 <a name="id名"></a> --> <a href="#p1">颜色1</a> <a href="#p2">颜色2</a> <a href="#p3">颜色3<a name="tt"></a></a> <a href="#p4">颜色4</a> <a href="#p5">颜色5</a> <hr /> <h3>红色<a name="p1"></a></h3> <img src="img/nike/1.png" /> <h3>蓝色<a name="p2"></a></h3> <img src="img/nike/2.png" /> <h3>紫色<a name="p3"><a href="#tt">返回</a></a></h3> <img src="img/nike/3.png" /> <h3>绿色<a name="p4"></a></h3> <img src="img/nike/4.png" /> <h3>棕色<a name="p5"></a></h3> <img src="img/nike/5.png" /> <p align="right"><a href="#top">返回顶部</a></p> </body> </html>1)简历表格
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <h3 align="center">个人简历</h3> <table border="1" align="center" cellspacing="0"> <tr> <td align="center" height="30" bgcolor="deepskyblue">姓名</td> <td width="100"></td> <td align="center" width="100"bgcolor="deepskyblue">性别</td> <td></td> <td rowspan="5" width="100" align="center">照片</td> </tr> <tr> <td align="center" height="30"bgcolor="deepskyblue">出生年月</td> <td></td> <td align="center"bgcolor="deepskyblue">籍贯</td> <td></td> </tr> <tr> <td align="center" height="30"bgcolor="deepskyblue">政治面貌</td> <td></td> <td align="center"bgcolor="deepskyblue">民族</td> <td></td> </tr> <tr> <td align="center"height="30"bgcolor="deepskyblue">健康状况</td> <td></td> <td align="center"bgcolor="deepskyblue">婚姻状况</td> <td></td> </tr> <tr> <td align="center"height="30"bgcolor="deepskyblue">联系电话</td> <td></td> <td align="center" align="center"height="30"bgcolor="deepskyblue">电子邮箱</td> <td width="100" align="center"><font size="1">www.jinjin.com</font></td> </tr> <tr> <td align="center"height="30"bgcolor="deepskyblue">求职意向</td> <td colspan="4"></td> </tr> <tr> <td align="center" height="200"bgcolor="deepskyblue">工作经历</td> <td colspan="4"></td> </tr> <tr> <td align="center" height="40"bgcolor="deepskyblue">教育经历</td> <td colspan="4"></td> </tr> <tr> <td align="center" height="40"bgcolor="deepskyblue">英文水平</td> <td colspan="4"></td> </tr> <tr> <td align="center" height="40"bgcolor="deepskyblue">计算机水平</td> <td colspan="4"></td> </tr> <tr> <td align="center" height="40"bgcolor="deepskyblue">自我评价</td> <td colspan="4"></td> </tr> </table> </body> </html>简历图片
2)财务报表
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> 1.用HTML语言实现下列表格.可自己设定表格颜色 <p align="center">财务报表</p> <table border="1" cellspacing="0" align="center"> <tr align="center"> <td>季度</td> <td colspan="2">收入(元)</td> <td colspan="2">支出(元)</td> </tr> <tr align="center"> <td></td> <td>建筑</td> <td>房地产</td> <td>销售服务</td> <td>办公</td> </tr> <tr align="center"> <td>第一季度</td> <td>306000</td> <td>282000</td> <td>90000</td> <td>10000</td> </tr> <tr align="center"> <td>第二季度</td> <td>450000</td> <td>364000</td> <td>54000</td> <td>20000</td> </tr> </table> </body> </html> <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> 2.用HTML语言实现下列表格.可自己设定表格颜色 <p align="center">财务报表</p> <table border="1" cellspacing="0" align="center"> <tr align="center"> <td colspan="2">品牌</td> <td colspan="3" width="150">春装</td> <td colspan="3" width="150">夏装</td> </tr> <tr align="center"> <td colspan="2"></td> <td>男 装</td> <td>女 装</td> <td>童 装</td> <td>男 装</td> <td>女 装</td> <td>童 装</td> </tr> <tr align="center"> <td rowspan="2">JC</td> <td width="90">牛仔系列</td> <td>116</td> <td>98</td> <td>68</td> <td>88</td> <td>86</td> <td>46</td> </tr> <tr align="center"> <td>休闲系列</td> <td>120</td> <td>100</td> <td>80</td> <td>98</td> <td>88</td> <td>50</td> </tr> </table> </body> </html>运行图示
运行图