我的网站页脚现在只有几个链接,如下所示,将来可能有 N 个链接。基本上我想将链接对齐到页脚的中心。我知道如果我将固定宽度或位置添加到我编写的以下 CSS 中,它会起作用。但我不想设置任何固定宽度,因为将来链接的数量会增加。将链接对齐到中心的最佳方式是什么。
HTML 代码
<footer>
<ul>
<li> <a href="#">Home</a></li>
<li><a href="#">About Us</a></li>
<li><a href="#">Services</a></li>
<li><a href="#">Contact Us</a></li>
</ul>
</footer>
CSS
footer{
background: #EEEEEE;
margin: 0 auto;
height: 30px;
padding-top: 20px;
width: 100%;
text-align: center;
}
footer ul{
margin: 0px;
}
footer li {
float: left;
list-style-type: none;
line-height: 9px;
height: 11px;
border-right: 1px solid #354052;
padding: 0px 10px;
}
footer li a{
text-decoration: none;
color: #354052;
font-size: 12px;
}
最佳答案
试试这个
footer{
background: #EEEEEE;
margin: 0 auto;
height: 30px;
padding-top: 20px;
width: 100%;
text-align: center;
}
footer ul{
margin: 0px;
padding:0;
}
footer li {
/* float: left; */
list-style-type: none;
line-height: 9px;
height: 11px;
border-right: 1px solid #354052;
padding: 0px 10px;
display:inline;
}
footer li a{
text-decoration: none;
color: #354052;
font-size: 12px;
}
<footer>
<ul>
<li> <a href="#">Home</a></li>
<li><a href="#">About Us</a></li>
<li><a href="#">Services</a></li>
<li><a href="#">Contact Us</a></li>
</ul>
</footer>
关于html - 将页脚中的列表居中对齐,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39118321/