本文聊的是錨點和熱點區(qū)域的錨點
喵
想要更詳細的了解錨點可以學(xué)習(xí)
其實錨點還算簡單,是學(xué)習(xí)的少了才不知道熱點區(qū)域map這個標簽,所以特來總結(jié)與分享。
有什么用?
一篇長文想要快速通過目錄來進行閱讀之類的功能
介紹
百度百科-錨點:是網(wǎng)頁制作中超級鏈接的一種,又叫命名錨記。命名錨記像一個迅速定位器一樣是一種頁面內(nèi)的超級鏈接,運用相當普遍。
個人理解的錨點:快速定位,hash。由于在地址的后面價格#的大部分都是hash,如今的單頁路由的原理也和hash有關(guān)。
hash
錨點的使用a標簽的href是個關(guān)鍵
幾種使用方法:
a標簽href 跳轉(zhuǎn)對象為元素為id 也可以通過name來進行跳轉(zhuǎn)前提有name屬性
// 大家可以給元素加點css
<a href="#1F"></a>
<a href="#2F"></a>
<div id="1F">1F</div>
<a name="2F">2F</a>
在圖片上也想做錨點?用map
<body>

<map name="Map">
<area shape="poly" coords="245,18,254,97,255,143,263,161,258,182,256,217,250,239,242,257,240,281,237,296,272,297,302,300,325,299,338,296,354,297,375,298,394,298,408,298,419,298,421,291,416,282,413,264,409,250,402,232,395,215,387,196,386,183,381,170,372,160,371,150,378,138,378,123,376,96,377,81,379,70,382,53,384,33,380,22,374,16,360,24,354,37,350,47,341,55,326,59,309,61,295,61,279,49,274,36,262,31,257,23" href="#F1">
</map>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<span id="F1">
喵!
</span>
</body>
點擊貓進行跳轉(zhuǎn)
簡單介紹一下map的用法:
注意要告訴他用哪個map,area是告訴他在圖片上的區(qū)域
<img src="" usemap="#Map">
<map name="Map">
<area>
</map>
area中有重要的幾個屬性:
- coords 這個是要選中的地區(qū)里面有圓、矩形、多邊形
- href 跳轉(zhuǎn)的地址、錨點
- 有需要可以看這個 菜鳥教程-area
tip:可以通過DW中有熱點選擇的功能,還算方便,省去了坐標的問題
就寫到這,我自己都覺得想應(yīng)付人,但是這個東西只是不知道,想了解幾分鐘就能上手了,謝謝大家!