在写网页的过程中,总是写完了这一套,样式出了问题又去找问题废了好长时间
总结一下写法
以下是结构 经常会出现 li 里面与文字不在一个高度上
<div class="indicators">
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ul>
</div>
解决方法: ul 的高 == li 的高 == ul 的 行高 == li 的行高
.indicators ul {
width: 100px;
height: 15px;
background:rgba(0,0,0,0.3);
line-height: 15px;
border-radius: 10px;
}
.indicators li {
float: left;
border-radius: 50%;
width: 15px;
height: 15px;
background-color: #fff;
text-align: center;
margin-right: 10px;
font-size: 10px;
cursor: pointer;
}