css 使用padding 百分比值实现高度自适应（多用于占位，避免闪烁）

.item {
  float: left;
  margin: 10px 5%;
  padding-bottom: 33.98%; /*高除以宽*/
  width: 21%;
  height: 0;
}

demo: http://jsfiddle.net/luin/25BbH/7/

改变大小始终保持保持恒定的宽高比， 常用于移动端，

//占位 是否可控高度：false（无法控制min-height,但没有多余结构） true(可控制min-height，但要增加结构)
@mixin proporBox($arg:1, $type:false, $ele:':before'){
    position: relative;
    @if $type == true {
        &#{$ele}{
            content: '';
            display: block;
            width: 100%;
            padding-top: percentage($arg);
        }
    }@else{
        padding-top: percentage($arg);
    }   
}

sass