示例
圖片alt屬性
<img>中有一個(gè)alt屬性,英文叫alternate text。例句如下:
<img src = "../images/html_tutorials/smile.jpg" alt="smile face">
假使瀏覽器沒(méi)有載入圖片的功能,瀏覽器就會(huì)轉(zhuǎn)而顯示Alt屬性的值。
其實(shí),現(xiàn)在大多數(shù)瀏覽器都支持圖片載入。在此介紹Alt屬性,是因?yàn)樗牧硗庖粋€(gè)重要功能。目前搜索引擎抓取工具無(wú)法識(shí)別圖像中所含的文字,所以用ALT屬性寫(xiě)上圖片的說(shuō)明,便于搜索引擎抓取你網(wǎng)頁(yè)的內(nèi)容。
示例
圖片align屬性
用align屬性,可以改變圖片的垂直(居上、居中、居下)對(duì)齊方式和水平對(duì)齊方式(居左、居中、居右)。
示例
圖片的大小
在缺省狀況下,圖片顯示原有的大小。你可以用height和width屬性改變圖片的大小。不過(guò)圖片的大小一旦被改變,圖片會(huì)相應(yīng)放大或縮小,顯示出來(lái)的結(jié)果可能會(huì)很難看。
示例
建議
圖片相對(duì)文字,所占的字節(jié)數(shù)較多,比如一個(gè)全屏的圖片,即使經(jīng)過(guò)壓縮,也要占去大約50k字節(jié),這相當(dāng)于25000字的文本。因此瀏覽器載入圖片比較費(fèi)時(shí),建議一個(gè)HTML文件里不要包含過(guò)多的圖片,否則會(huì)影響你的網(wǎng)頁(yè)顯示速度。
更多示例
背景圖片
這個(gè)示例演示如何將一個(gè)圖片作為HTML網(wǎng)頁(yè)的背景圖片。
將一個(gè)圖片作為一個(gè)超鏈接
這個(gè)示例演示了如何將一個(gè)圖片作為一個(gè)超鏈接,即點(diǎn)擊一個(gè)圖片,可以連接到其它文件。