9html的圖片img標(biāo)簽課件及代碼

HTML的圖片img標(biāo)簽主講人：高洛峰&妹子

插入圖片img標(biāo)簽--代表HTML圖像

img標(biāo)簽是單獨(dú)出現(xiàn)的：<img/>，img是image(圖像)的縮寫常用屬性:

alt--代表圖像的替代文字src--代表一個(gè)圖像源(就是圖像的位置)border–代表圖片邊框的寬度height--代表一個(gè)圖像的高度width--代表一個(gè)圖像的寬度設(shè)計(jì)網(wǎng)頁(yè)時(shí)經(jīng)常使用的圖片有三種格式：GIF--最多支持256色,支持透明,支持多幀動(dòng)畫顯示效果.JPEG--支持多種顏色,可以有很高的壓縮比,使用了有損壓縮,不支持透明,不支持動(dòng)畫效果.PNG--是一種新的圖片技術(shù),可以表現(xiàn)品質(zhì)比較高的圖片,使用了無(wú)損壓縮,支持透明,不支持動(dòng)畫.map標(biāo)簽--定義圖像點(diǎn)擊區(qū)域的集合map標(biāo)簽是成對(duì)出現(xiàn)的,即<map>…</map>,而且必須配合area標(biāo)簽使用。map標(biāo)簽中name與id屬性指定的值必須與定義圖像點(diǎn)擊區(qū)中圖像(img)的usemap屬性指定的值一致。屬性id--定義map的名稱。name--定義map的名稱。area標(biāo)簽--定義圖像點(diǎn)擊區(qū)域,area標(biāo)簽是單獨(dú)出現(xiàn)的,<area/>

area標(biāo)簽必須使用在map標(biāo)簽中，而且必須配合img標(biāo)簽使用。屬性accesskey--鏈接的快捷鍵訪問(wèn)方式alt--圖像的提示文字coords--定義可點(diǎn)擊區(qū)域圖形的坐標(biāo)href--HTML鏈接源的URLnohref--圖像點(diǎn)擊排除的區(qū)域，當(dāng)不使用href時(shí)應(yīng)使用nohrefshape--可點(diǎn)擊區(qū)域的形狀tabindex--使用"Tab"鍵的遍歷順序target--鏈接目標(biāo)圖

像

地

圖<imgsrc="images/linux_logo.jpg"usemap="#Map"/>

<mapname="Map"id="Map"> <areashape="rect"coords="35,29,135,99"href="#"/> <areashape="circle"coords="243,78,44"href="#"/> <areashape="poly"coords="120,137,195,154,135,207"href="#"/></map><map>與<area>標(biāo)簽應(yīng)用實(shí)例

rect定義一個(gè)矩形區(qū)域，coords屬性設(shè)置值為矩形的左上角、右下角的坐標(biāo)poly定義一個(gè)多邊形區(qū)域，coords屬性設(shè)置值為多邊形各頂點(diǎn)的坐標(biāo)值circle定義一個(gè)圓形區(qū)域，coords