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属性。