【问题标题】:Unordered List Won't Center Align无序列表不会居中对齐
【发布时间】:2015-01-17 10:52:29
【问题描述】:

h1 似乎没有问题居中,但是,列表(菜单栏)不会对齐,它似乎有点缩进。请解释一下。

我的 HTML:

<h1>Welcome!</h1>

    <ul>
        <li>Home</li>
        <li>About Us</li>
        <li>Contact</li>
    </ul>

我的 CSS:

h1{
text-align: center;
}

ul{
  position:relative;
  display: inline-block;  
  list-style: none;
  width:100%;
  text-align: center;
  margin: auto;
}

li{
  list-style: none;
  text-align: center;
  margin: 15px; 
  display: inline-block; 
}

【问题讨论】:

    标签: html css centering


    【解决方案1】:

    ul 元素上仍有默认填充。 将 ul 的 CSS 更改为此,它会起作用:

    ul{
      position:relative;
      display: inline-block;  
      list-style: none;
      width:100%;
      text-align: center;
      margin: auto;
      padding: 0;
    }
    

    【讨论】:

      猜你喜欢
      • 2019-05-01
      • 2019-05-28
      • 2011-01-17
      • 1970-01-01
      • 1970-01-01
      • 2014-05-12
      • 2020-01-31
      • 2014-03-06
      • 1970-01-01
      相关资源
      最近更新 更多