html - 如何在页面中间将两个 UL 类直接堆叠在一起

Question

我试图将这两者居中，以便中间图像直接位于中心，“nav navbar-nav”中的文本也居中，而不是从“BSM”一词开始。

<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
    <ul class="nav navbar-nav">
        <img src="insertimage">
    </ul>
    <ul class="nav navbar-nav">
         <li><a href="/">BSM <strong>PROJECT</strong> CONNECT</a></li>
    </ul>
</div>

我在 CSS 中以 50% 的左外边距成功居中，但在 z-index 方面却运气不佳。如何让两个对象直接位于页面中央，图像直接均匀地位于文字上方？

CSS:

div.collapse.navbar-collapse {
  text-align:left;
  width: 400px;
  display: block;
  margin-left: auto;
 margin-right: auto;
}

Answer 1

正如@showdev 所说的那样有助于查看您的 css，请尝试在父容器中设置宽度并添加 margin:0 auto。如果这张图片不在 li 标签内，我也看不出对图片使用 Ul 有什么意义。

您还可以使用 text-align: center with the parent element 的其他方式。