img，bg

img

vertical-align:middle;    设置页面垂直居中的，如果无效的话使用 display:table-cel,讲块元素转化为单元格，在使用vertical-align属性水质居中。

max-width:100%;   限制了图片大小。图片本身是多大就是多大。不会超过100%的宽度；

width:100%;  始终和父级相等，父级是100px；图片的100%=100px;父级是 500px,图片100%=500px;

也可以利用行高来解决垂直居中：

css:

.d1{ width:50px;  height:150px; line-height:150px;}
.d1 img{ width:100%; max-width:50px; max-height:60px; }

html:

<div class="d1">

<img src="aa.png" />

</div>

background:

background-size:cover；把背景图片扩展至足够大，以使背景图片完全覆盖背景区域。

background-size：contain；把背景图片扩展至最大尺寸，以使宽度和高度完全适应内容区域。