chrome中image图片预留位置的问题

在项目中发现，当设置 <img src="" width="100" height="100"> 通过设置img的width属性和height属性在img未请求回来之前为其预留位置。

浏览器在渲染时会为这张图片预留出100px*100px的的位置，等待图片的加载。这种方式可以避免图片错乱的问题，同时避免因为图片而造成的页面重排。

但问题是在chrome浏览器中，这种策略并没有生效。其它主流浏览器均正常。

解决hack方案是：为该图片包裹一层span并设置为inline-block。但这种方式增加了代码，并且破坏了html的结构化。