<img> 元素

1. 我们可以在 元素上应用常规排版相关的样式。如果图片的备选文本(alt)显示的话,这些样式会在其上生效,并且不会影响正常加载的图片。

2. 元素是替换元素。这是一种"外观和大小都由外部资源来决定的元素"(Sitepoint)。因为这个元素是由外部资源所控制,所以 :before 和 :after 伪元素一般不会跟它一起生效。但是,当图片损坏或者没有加载时,这些伪元素就会显示出来。

基于以上这两点,我们能够在 元素上应用只有当图片加载失败候会显示的样式,正常加载的图片并不会受到影响。


Firefox是通过before来显示alt文本的,content属性不能改。chrome是通过shadowDOM显示的。