比如下面这组布局，看起来很和谐，但是当一张图片加载不出的时候，就会出现文字被移动上去的样式问题，很影响效果，如何才能在这种情况下把上面留白占位呢？
布局：
最简单的直接给盒子先加上高度？但是现在的开发中通常需要自适应，元素宽度均根据页面变化而变化，所以图片的宽高也会按比例变化，在图片盒子上先设置高度也是不可取的。
于是尝试以下办法可解决：
首先我们可以确定这组图片的宽高比，这组图片的高度是宽度的72%左右。
css：
可以看到问题顺利解决了，思路就是用padding撑起图片div的高度，保证里面无论有没有图片都不会塌陷，但是padding会挤掉正常的图片，所以我们可以使图片相对于图片盒子进行绝对定位，定位到左上角，就OK了。
绝对居左下的方式：图片包括任何的标签都是不能默认绝对居下的，都是需要通过css样式控制的，这个就要用到定位。给img添加一个绝对定位position:absoluteleft:0bottom:0也需要给它的某个父级添加一个相对定位。
img标签是向网页中嵌入一幅图像。
注意，从技术上讲，<img>标签并不会在网页中插入图像，而是从网页上链接图像。<img>标签创建的是被引用图像的占位空间。
<img>标签有两个必需的属性：src 属性 和 alt 属性。
