中心ul李图像div
问题描述:
我想中心ul和li图像,但它没有发生我试过this但这不适用于我。中心ul李图像div
我想中心的无序列表,它的列表项
HTML
<div class="brands">
<ul>
<li><img src="images/flipkart.png"></li>
<li><img src="images/ola.png"></li>
<li><img src="images/olx.png"></li>
<li><img src="images/telenor.png"></li>
<li><img src="images/uc.png"></li>
<li><img src="images/oyo.png"></li>
</ul>
</div>
CSS
.brands {
width: 100%;
min-height: 120px;
background-color: #d7d7d7;
}
.brands ul {
margin-right: 10%;
margin-left: 10%;
}
.brands li {
float: left;
list-style: none;
}
.brands img {
padding: 35px 40px;
}
答
如果你给float: left
,它永远不会被视为inline
元素。使用display: inline-block
使它成为inline
元素与block
的性质使用text-align: center
使其居中:
.brands li {
display: inline-block;
list-style: none;
}
.brands ul {
text-align: center;
margin-right: 10%;
margin-left: 10%;
}
谢谢各位大大它的工作原理 –
是的,我打算这一点,但我不得不等待9分钟,还是谢谢你 –
@ AyazAlam你是受欢迎的朋友。 ':)' –