如何解决img标签src为空或加载失败后的边框问题？

img标签的src为空或者加载失败，浏览器都会自动加上一个边框，这会让人头疼，因为它一定程度上影响着网页的美观。。。

昨天我就遇见了这个问题，最后找到了自我觉得比较理想的方法。

 

（1）针对路径为空，网上还有js、绝对定位、margin聚焦等方法，个人认为这是最简单有效的方法（人太懒了，哈哈哈）

img[src=""],img:not([src]){opacity:0;}  /*这样可以实现在路径为空时隐藏*/

（2）针对图片加载失败：

  首先找到加载失败的原因，路径、分辨率，或者其他问题？

  如果是路径的话，好解决；分辨率的话，就可以用lowsrc=“低分辨率时显示的图片"；

  遇见其他的问题，那么可以通过onerror去设置一个用于出错时显示的默认图片，个人觉得这种情况下就是解决其样式的问题了，这个网站提供了很多样式:https://bitsofco.de/styling-broken-images/