隐藏损坏的图片图标(边框)

当加载图片损坏时我们通常会以特定的图片显示加载失败的图片,一般以onError方法替换图片地址实现,下面记录一个纯css简单实现的、兼容性好的替换破损图片的方案:

img {  
  position: relative;
}

img[alt]:after {  
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #fff;
  font-family: 'Helvetica';
  font-weight: 300;
  line-height: 2;  
  text-align: center;
  content: attr(alt);
}
posted @ 2020-12-11 10:22  neeter  阅读(306)  评论(0编辑  收藏  举报