css宽高等比列缩放

by gothic

HTML

<div class="box">
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
</div>

CSS

.box{
    width:100%;
}
.item {
    width:40%;
    height:0;
    padding-bottom: 80%;
    background-color:#f00;
    float:left;
    margin:10px 5px;;
}