用background-size做响应式布局背景图

现在响应式布局越来越流行，但是网站的logo一般是用的 background(背景图片) 属性实现，而不是直接在页面使用img标签。如果使用背景，在css2里面宽高是固定的值，那么这就不适合响应式布局了，网站百度一下搜到 css3里面新增了 background-size，可以实现自适应div的宽高改变背景图片的大小。

/*只要这样就对了*/
background-size:contain;

/*W3c标准*/

实际使用场景

.header .m-logo a {
display: block;
width: 100%;
height: 100%;
overflow: hidden;
line-height: 100em;
}
/* 设置div宽度 让背景图缩小铺满div */
@media (max-width: 720px){
  .header .m-logo {
  background-size: contain;
  width: 107px;
  }
}