原理
1.给logo外面套一个盒子(比如li),设置li的宽度为width: 9%,高度为height:0;最重要的是设置li的padding-bottom:9%;position:relative;
2.里面的logo设置width: 100%;height: 100%;position:absolute;left:0;top:0;
代码
html部分
<div class="box">
<ul>
<li><img src=""/></li>
<li><img src=""/></li>
<li><img src=""/></li>
<li><img src=""/></li>
<li><img src=""/></li>
<li><img src=""/></li>
</ul>
</div>
css部分
.box{
padding: 0 15px;
}
ul,li{
padding: 0;
margin: 0;
list-style: none;
}
ul{
overflow: hidden;
}
li{
float: left;
width: 9%;
height:0;
margin:5px 0.5%;
padding-bottom:9%;
position:relative;
border-radius:50%;
}
img{
display: block;
border-radius: 50%;
width: 100%;
height: 100%;
position:absolute;
left:0;
top:0;
}