我想将我的一个 li 元素移到右边，我查看了其他解决方案，但它们不起作用。 li.right{ text-align: right;} 应该可以，但可能被之前的 css 取消了？
<body>
<nav class="navbar navbar-default navbar-fixed-top">
<div id="navbar container">
<ul class="nav navbar-nav">
<li><a href="#">Mac</a></li>
<li><a href="#">Iphone</a></li>
<li><a href="#">Ipad</a></li>
<li><a href="#">Watch</a></li>
<li class="right"><a href="#">Log In</a></li>
</ul>
</div>
</nav>
</body>
这是CSS
.navbar {
min-height:32px !important
}
.navbar .navbar-nav {
display: inline-block;
float: none;
vertical-align: top;
}
.navbar{
text-align: center;
padding-top: 5px;
}
.navbar{
font-family: "Times New Roman", Times, serif;
font-size: 20px;
}
li.right{
text-align: right;
}
最佳答案
使用专为此目的而设计的内置类的 Bootstrap 会更干净:
<nav class="navbar navbar-default navbar-fixed-top">
<div id="navbar container">
<ul class="nav navbar-nav">
<li><a href="#">Mac</a></li>
<li><a href="#">Iphone</a></li>
<li><a href="#">Ipad</a></li>
<li><a href="#">Watch</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="#">Log In</a></li>
</ul>
</div>
</nav>
关于css - 将 li 元素右对齐，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/41145683/