Question

我正在尝试使用bootstrap创建网页。然后，我使用＆＃34; nav-justified＆＃34;如下。

<div class="text-center">
    <div>
        <ul class="nav-justified">
            <li class="col-md-3">blah</li>
            <li class="col-md-3">blah</li>
            <li class="col-md-3">blah</li>
            <li class="col-md-3">blah</li>
        </ul>
    </div>
</div>

在网页上，如果你将尺寸排列得很小，那么就会有一些点＆＃34;·＆＃34;出现了。我想删除这些＆＃34;·＆＃34; 有人能告诉我如何解决这个问题吗？

或者是否有某种方式与＆＃34;导航对齐＆＃34;没有＆＃34;·＆＃34;？

如果你能回答我的问题，我很感激。谢谢。

Answer 1

你只需要在你的css中设置它（或直接自定义bootstrap）

@media screen and (max-width:768px) {
    ul.nav-justified {
        list-style-type: none;
    }
}

Answer 2

不应该将nav课程添加到ul

<div class="text-center">
    <div>
        <ul class="nav nav-justified"> <!-- added the nav class here -->
            <li class="col-md-3">blah</li>
            <li class="col-md-3">blah</li>
            <li class="col-md-3">blah</li>
            <li class="col-md-3">blah</li>
        </ul>
    </div>

codepen link

PS：我认为您不需要指定列表元素的水平大小（codepen without the size specifier）

Answer 3

将以下内容添加到CSS文件中：

ul.nav-justified {
  list-style-type: none
}

这将删除列表中的项目符号。

如何删除＆＃34; nav-justified＆＃34;用bootstrap

3 个答案: