深入理解HTML映像，深入理解映像

深入理解HTML映像，深入理解映像
目錄[1]<img> [2]<map> [3]<area><img> -> image 映像

    【必須屬性】

        【1】src:地址

        【2】alt:映像替代文本，供探索引擎抓取使用

    【可選屬性】

        【1】height:映像高度

        【2】width:映像寬度

        【3】ismap:為映像定義為伺服器端影像對應

        【4】longdesc:與alt屬性類似，提供多於1024字元的長文本描述

        【5】usemap:為映像定義用戶端影像對應 usemap = "#<map>元素的name或id屬性"

<img src="test.jpg" alt="測試圖片" width="100" height="100">

 

<map>映射地圖

        [注意]<img>中的usemap屬性可引用<map>中的id或name屬性(取決於瀏覽器),所以應同時向<map>添加id和name屬性。

 

<area>映像熱區

　　<area>總是嵌套在<map>標籤中

    【必須屬性】

        【1】alt:替代文本

    【可選屬性】

        【1】coords:定義可點擊地區的座標

        【2】href:定義此地區的目標URL

        【3】nohref:排除某個地區

        【4】shape:定義地區的形狀

　　　　【a】圓形(circ/circle) coords= "x,y,r" x,y是圓心座標；r是半徑

　　　　【b】多邊形(poly/polygon) coords = "x1,y1,x2,y2,x3,y3……" x,y是多邊形每個頂點的座標

　　　　【c】矩形(rect/rectangle) coords = "x1,y1,x2,y2" x1,y1是左上方座標；x2,y2是右下角座標

            【d】全部地區default(預設)

            [注意]<area>標籤採用"先來先得"的順序，如果地區有重疊，以先出現的<area>為準

<img src="jihe.jpg" alt="幾何圖形" width="600" height="220" usemap="#map"><map name="map" id="map">  <area shape="rect" coords="35,38,150,158" href="line4.html" alt="四邊形">  <area shape="poly" coords="175,109,193,44,268,41,296,109,233,151" href="line6.html" alt="六邊形">  <area shape="poly" coords="315,81,330,58,356,40,387,37,411,52,430,79,433,108,418,132,389,153,357,154,333,137,315,108" href="line12.html" alt="12邊形">  <area shape="circle" coords="512,95,60" href="line0.html" alt="圓形"></map>