为图裂定义样式

只要一点CSS就可以美化破损的图片：

  1. img {  
  2.   display: block;
  3.   font-family: sans-serif;
  4.   font-weight: 300;
  5.   height: auto;
  6.   line-height: 2;
  7.   position: relative;
  8.   text-align: center;
  9.   width: 100%;
  10. }

以添加伪元素的法则来显示用户信息和URL的引用：

  1. img::before {  
  2.   content: "We're sorry, the image below is broken :(";
  3.   display: block;
  4.   margin-bottom: 10px;
  5. }
  7. img::after {  
  8.   content: "(url: " attr(src) ")";
  9.   display: block;
  10.   font-size: 12px;
  11. }

了解更多关于这类样式的技巧 Ire Aderinokun 的 原帖.