有一个导航栏<div>
,里面是一个<ul>
,每个<li>
包含<a>
一个链接(这是一个导航栏)
我看了谷歌和这个网站,我无法找到我正在寻找的确切内容.
我想是能够让我当前的风格(使用<li>
带<a>
的内侧),我想的<li>
是均匀分布的,并集中(这部分顺其自然,如果他们是均匀分布的...)内<ul>
(这是内部的navbar <div>
).
无论如何,如果这没有意义让我知道,目前他们只是左对齐...继承人我拥有:
HTML:
<div class="navbar">
<ul>
<li><a href="Home">Home</a></li>
<li><a href="Discounts">Discounts</a></li>
<li><a href="Contact">Contact Us</a></li>
<li><a href="About">About Us</a></li>
</ul>
</div>
Run Code Online (Sandbox Code Playgroud)
CSS:
.navbar {
width: 100%;
margin-left: auto ;
margin-right: auto ;
background-color: #ABCDEF;
}
.navbar ul {
list-style-type: none; /*to remove bullets*/
text-align: center;
margin: 0px;
padding: 0px;
width: 90%;
overflow: hidden;
}
.navbar li{
float: left;
padding: 2px;
width: 150px;
margin-left: …
Run Code Online (Sandbox Code Playgroud)