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

申請免費試用、咨詢電話：400-8352-114

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

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

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

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

在IE瀏覽器中都會出現文字提示。

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

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

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