alt是html標籤的屬性,而title既是html標籤,又是html屬性。html
在圖像標籤img中,除了經常使用的寬度width和高度height屬性以外,還有兩個比較重要而且也會用到的屬性,就是alt和title,這都是用來顯示圖片內容的具體信息的,可是這兩個屬性也有不一樣的地方。優化
title:搜索引擎
title做爲標籤時,網頁的標題就是寫在這對標籤以內的。spa
title做爲屬性時,能夠爲元素提供額外說明信息。例如,給超連接標籤a添加了title屬性,title用來給連接文字或普通文字提示的。把鼠標移動到該連接上面是,就會顯示title的內容,以達到提示的效果。code
alt:htm
alt屬性只能用在img、area和input元素中,用於網頁中圖片沒法正常顯示時給用戶提供文字說明使其瞭解圖像信息。alt是這個圖片的一個屬性,至關因而在告訴搜索引擎這張圖片說的是什麼,這個對於seo優化有必定的做用。blog
代碼:索引
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>圖片的alt和title屬性</title> </head> <body> <img src="song.jpg" width="100px" height="100px" alt="月亮"/> <!--alt指的是當圖片名字不正確或者當圖片的路徑有錯誤時,在原本顯示圖片的位置裏顯示出alt的內容,以方便本身或者用戶識別該圖片是幹什麼的--> <img src="song.jpg" width="100px" height="100px" title="月亮"/> <!--title指的是當圖片名字不正確或者當圖片的路徑有錯誤時,在原本顯示圖片的位置裏也會顯示出alt的內容,而且當圖片名字、路徑都正確時,當鼠標移到圖片的區域範圍內,也會顯示出title的信息--> </body> </html>
總結來講,alt和title一塊兒使用時最好,title能夠代替alt的工做,反之則不行。seo