纯css实现宽度自适应，高度与宽度成比例

html：

 <div></div>

css

div{
    width: 33.33%;
    box-sizing: border-box;
    float: left;
    position: relative;
}
div::before{
    content: "";
    padding-top: 100%;  /*关键代码*/
    display: block;
}