Day02-2 常用标签04 超链接

语法结构

href：要跳转的⻚⾯链接。

target：以什么形式跳转，self表示在当前选项卡进⾏跳转，_blank以新的选项卡进⾏跳转。

⽂字超链接

<a href="new_file.html">页面跳转</a>  <!-- 跳到某个页面 -->

<a href="https://www.baidu.com/" target="_blank">百度跳转</a>  <!-- 跳到某个网址 -->

锚链接

 <a href="#bottom">直达⻚尾</a>
 <div id="top" style="border: 1px solid red;height: 1000px;"></div>
 <div style="border: 1px solid green;height: 1000px;"></div>
 <div id="bottom" style="border: 1px solid blue;height: 1000px;"></div>
 <a href="#top">回到顶部</a>

#表示id属性值

图片链接

<a href="new_file3.html" target="_blank">
 <img src="1.jpg" alt="">
 </a>

热区超连接

<img src="1.jpg" useMap = "#link-map">
<map name = 'link-map'>
    <area shape="rect" coords="47,307,351,413" href="http://www.baidu.com">
    <area shape="circle" coords="600,600,200" href ="http://www.jd.com" alt="Mercury" />
    <area shape="poly" coords="0,0,200,0,200,200,100,300,0,200" href="http://www.taobao.com">
</map>

coords配合shape：定义了链接地址

圆形：shape=“circle”，coords=“x,y,z”

多边形：shape=“polygon”，coords=“x1,y1,x2,y2,x3,y3,…”

矩形：shape=“rectangle”，coords=“x1,y1,x2,y2”