首先我們看下這個標簽到底是干什么的！
W3C的定義：
然后兼容性：
然后與之配套使用的另一個標簽：
<area/>規定其區域；
我們來看看<map>標簽支不支持全局屬性；=====》
發現它是支持全局屬性的；
使用方法：其實<map>只是給瀏覽器做了一個說明，我要對一個圖片創建一個區域映射；所以我們還得有一張圖片指向<map>標簽。作為指向那么是唯一的；所以我們可以設置id與圖片對應；還可以設置name與其進行對應；
如下code；
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Map標簽的用法</title> <style type="text/css"> div{ width: 800px; height: 800px; position: relative; margin: 0 auto; } </style> </head> <body> <div class="CsOuterdiv"> <h2>Map標簽的用法</h2> <img src="../../img/Sky.jpg" style="width: 600px;height: auto;" /> <map></map> </div> </body> </html>
//首先注意：<area/>是個單標簽；
它的屬性有；
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Map標簽的用法</title> <style type="text/css"> div { width: 800px; height: 800px; position: relative; margin: 0 auto; } </style> </head> <body> <div class="CsOuterdiv"> <h2>Map標簽的用法</h2> <img src="../../img/Sky.jpg" style="width: 600px;height: auto;" usemap="#MyfirstMap" border="0" alt="testimg" /> <map id="MyfirestMap" name="MyfirstMap"> <area shape="circle" coords="180,139,14" href ="http://www.baidu.com" alt="百度" /> <area shape="circle" coords="129,161,10" href ="http://jingdong.com" alt="京東" /> <area shape="rect" coords="0,0,110,260" href ="http://taobao.com" alt="淘寶" /> </map> </div> </body> </html>