img標籤的alt和title的區別以及會引發的隱性bug

img是html 中的標籤，主要用來定義圖像。是一個空標籤，意思是說，它只包含屬性，並且沒有閉合標籤。

必要的常用的屬性：

• alt： 當圖片加載不出來時作爲替代文本出現
  如下圖：
  
• title：鼠標移動到元素上的提示或者說明
  如下圖：
• src：圖像的url地址
• height：設置圖像的高度
• width：設置圖像的寬度

需要注意的點：

• src屬性存在，但屬性值爲空的時候，瀏覽器會去加載圖片資源，並且默認img標籤會被畫出來，看上去像是邊框，實際上是它的默認大小。
  

<img src=""  alt="我是空的" srcset="" title="logo">

如下圖：

• src屬性不存在，但是img標籤存在，瀏覽器不會加載圖片資源，但默認img標籤也會被畫出來。

<img  alt="我是空的" srcset="" title="logo">

如下圖：

總結： 在某些瀏覽器上，img標籤的src屬性的屬性值爲空或者src屬性不存在的時候，默認的佔位邊框是看不見的，而上述舉例出來的瀏覽器是會被畫出來的，這樣會導致隱形bug，這是一個需要注意的瀏覽器兼容性問題。 因此使用img標籤的時候，當src屬性的屬性值沒有的時候，我們應該讓img標籤整個不存在，而不是設置src屬性的屬性值爲空或者僅僅去掉src屬性。