我有一个导航栏,我想在一行上,它会这样做,但是每个元素之间只有一个空间,我希望它们间隔均匀,并且灵活,这样当我改变窗口大小时它们调整。
这是我的 html
<div class="navigation">
<div class="navhead">
<h2>Navigation</h2>
</div>
<div class="navlist">
<ul>
<li><a href="Home Page.html">Home</a></li>
<li>Chat</li>
<li>Blog</li>
</ul>
</div>
</div>
这是我的CSS
.navlist li{
text-decoration: none;
color: #000000;
list-style-type: none;
display: inline;
text-indent: 10%;
}
请记住我是 7 年级,不要使用太复杂的词
最佳答案
只需应用 li 的宽度,并在需要时添加填充值。但是将内联更改为表格单元格。并应用它们之间的空间应用 border-spacing 值如下:
.navlist{
border-spacing: 10px;
}
.navlist li{
text-decoration: none;
color: #000000;
list-style-type: none;
display: table-cell;
text-indent: 10%;
width: 20%;
padding: 1em;
}
关于html - 导航列表,内联和带间距,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18438427/