相关疑难解决方法(0)

在<div>内的<ul>内部水平居中/均匀分布<li>

有一个导航栏<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)

css centering

28
推荐指数
3
解决办法
6万
查看次数

标签 统计

centering ×1

css ×1