小編給大家分享一下html中如何使用area標簽，希望大家閱讀完這篇文章后大所收獲，下面讓我們一起去探討吧！
html area標簽的定義和用法：
<area> 標簽定義圖像映射中的區域（注：圖像映射指得是帶有可點擊區域的圖像）。
area 元素總是嵌套在 <map> 標簽中。
注釋：<img> 標簽中的 usemap 屬性與 map 元素 name 屬性相關聯，創建圖像與映射之間的聯系。
HTML<area>標簽實例：
帶有可點擊區域的圖像映射：
<img src="planets.jpg" border="0" usemap="#planetmap" alt="Planets" /> <map name="planetmap" id="planetmap"> <area shape="circle" coords="180,139,14" href ="venus.html" alt="Venus" /> <area shape="circle" coords="129,161,10" href ="mercur.html" alt="Mercury" /> <area shape="rect" coords="0,0,110,260" href ="sun.html" alt="Sun" /> </map>
<area>標簽屬性：
alt：區域的替代文本。
coords：區域的坐標。
href：區域的目標url。
hreflang：目標url的語言，html5中的新屬性。
media：目標url是為何種媒介/設備優化的，html5中的新屬性。
nohref：沒有相關鏈接的區域，html5不支持。
rel：當前文檔與目標url之間的關系，html5中的新屬性。
shape：區域的形狀。
target：在何處打開目標url。
type：目標url的 MIME 類型，html5中的新屬性。
格式：
<area shape="形狀" coords="坐標" href="目標URL">
HTML<area>標簽實例：
<!doctype html> <html> <head> <meta charset="UTF-8"> <title>html< area>標簽_PHP筆記</title> </head> <body> <img src="https://cache.yisu.com/upload/information/20200318/90/8326.jpg" alt="html< area>標簽" width="300px" height="70px" alt="PHP筆記logo" usemap="#logo"> <map name="logo"> <area shape="rect" coords="0,0,70,70" alt="圖標" href="#"> <area shape="rect" coords="85,0,280,50" alt="PHP筆記" href="#"> <area shape="rect" coords="85,50,275,70" alt="www.php.cn" href="#"> </map> <h4>上面圖片被分為3個區域</h4> </body> </body> </html>
注釋：<img> 中的 usemap 屬性可引用 <map> 中的 id 或 name 屬性（由瀏覽器決定），所以我們需要同時向 <map> 添加 id 和 name 兩個屬性。
HTML 與 XHTML 之間的差異
在 HTML 中，<area> 沒有結束標簽。
在 XHTML 中，<area> 必須正確地關閉。
看完了這篇文章，相信你對html中如何使用area標簽有了一定的了解，想了解更多相關知識，歡迎關注億速云行業資訊頻道，感謝各位的閱讀！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
