圖片Alt和Title屬性有什么不同

申請免費(fèi)試用、咨詢電話：400-8352-114

    網(wǎng)站上的圖片有兩種屬性，一種是alt屬性，另一種是title屬性，這兩種屬性有什么不同呢？景德鎮(zhèn)網(wǎng)站建設(shè)顧問來告訴您。

    在ie6下面，我們會看到圖片沒有title屬性，只有alt屬性，設(shè)置了之后，鼠標(biāo)放到圖片上，還是會有顯示的。如果沒有alt屬性，而有title屬性，在ie6下面也可以看到提示信息。而在火狐瀏覽器下面，就不是這樣的效果了，alt屬性是不顯示的。為什么會這樣呢？因為IE不符合網(wǎng)頁標(biāo)準(zhǔn)。

    在標(biāo)準(zhǔn)瀏覽器下圖片設(shè)置了title屬性不管圖片是否存在，鼠標(biāo)經(jīng)過都會有提示。若圖片不存在時候，只設(shè)置了alt屬性，那么圖片上會顯示alt屬性里的描述內(nèi)容，并且鼠標(biāo)放上去沒有提示信息（非ie6以下瀏覽器）。

更清楚的看alt屬性和title的不同：
//*這些圖片不顯示
<img src="http://www.hqzl.net/../images/web-design.jpg" width="70" height="60"alt="網(wǎng)站建設(shè)">
<img src="http://www.hqzl.net/../images/web-design.jpg" width="70" height="60" title="網(wǎng)站建設(shè)" />
//*這些圖片顯示
<img src="http://www.hqzl.net/../images/web-design.jpg" title="網(wǎng)站建設(shè)" />
<img src="http://www.hqzl.net/../images/web-design.jpg" alt="網(wǎng)站建設(shè)" />

在IE瀏覽器中都會出現(xiàn)文字提示。

    而在火狐瀏覽器中，前三句代碼，鼠標(biāo)經(jīng)過圖片時，都會出現(xiàn)文字提示，最后一句代碼，鼠標(biāo)經(jīng)過圖片不會顯示文字提示。通過這些可以知道在顯示時候alt屬性和title的不同地方。

    圖片alt屬性用于指定圖片的替換文字，title屬性用于設(shè)置當(dāng)前對象提供建議性的信息。優(yōu)化網(wǎng)站圖片的時候，適合將alt屬性設(shè)置為圖片本來的含義，而將title設(shè)置成指示性信息，示例如下: 其作用是：alt屬性，當(dāng)圖片不能正常顯示時，則顯示alt中的文字，表達(dá)要傳遞的信息，將title屬性設(shè)置為“返回網(wǎng)站主頁”，作用是當(dāng)用戶將鼠標(biāo)指向圖片時，提示給用戶的信息。

    title屬性有一個很好的用途，即為鏈接添加描述性文字，特別是當(dāng)鏈接本身并不是十分清楚的表達(dá)了鏈接的目的。這樣就使得訪問者知道那些鏈接將會帶他們到什么地方，他們就不會加載一個可能完全不感興趣的頁面。另外一個潛在的應(yīng)用就是為圖像提供額外的說明信息，比如日期或者其他非本質(zhì)的信息。title屬性值可以比alt屬性值設(shè)置的更長。