如何使用 LESS 隐藏 Bootstrap 的 nav 和 nav-pills 类

Question

我在尝试在 Bootstrap 中隐藏某些类时遇到了问题——这给我带来了一些最大的麻烦。在这里，我想隐藏 nav 和 nav-pills 类的使用，但是如果我删除它们并使用 LESS 将它们嵌入到 .pills > ul 中并相应地调整我的所有代码，药丸本身将不会呈现，这让我感到困惑.在花了几个小时试图与之抗争之后，我不情愿地将这些类嵌入到文档中，但我仍然希望将它们删除。

这里是 HTML/PHP：

        <section class="pills" id="mus-art">
            <ul class="nav nav-pills">
                <li class="active"><a href="">Artist1</a></li>
                <li><a href="">Artist2</a></li>
                <li><a href="">Artist3</a></li>
                <li><a href="">Artist4</a></li>
                <li><a href="">Artist5</a></li>
                <li><a href="">Artist6</a></li>
                <li><a href="">Artist7</a></li>
                <li><a href="">Artist8</a></li>
                <li><a href="">Artist9</a></li>
                <li><a href="">Artist10</a></li>
                <li><a href="">Artist11</a></li>
                <li><a href="">Artist12</a></li>
                <li><a href="">Artist13</a></li>
                <li><a href="">Artist14</a></li>
            </ul>
        </section>
        <section id="contributor-info1">
                <?php include $_SERVER['DOCUMENT_ROOT']."/locationoffile"; ?>
        </section>

我的 LESS 文件中没有任何会干扰任何药片渲染的内容。我也使用了一些 jQuery，但仅用于更改在被点击时获得活动类的药丸。

Answer 1

您没有列出您调整的所有规则，但药丸不只是由ul.nav.nav-pills 选择器设置的。实际的药丸是<a> 元素，它们的样式由它们的.nav-pills 祖先设定。例如：

.nav-pills > li > a
/* OR */
.nav-pills > .active > a:hover

如果您不想使用.nav-pills 类，则必须重新定义所有这些规则，直接暗示设置此类的元素或在其选择器中使用此类的任何规则。

---

但是恕我直言，隐藏这些类对最终用户没有兴趣，唯一的兴趣是对其他开发人员或机器人隐藏框架的使用 - 除非您遇到与这些类的冲突，在这种情况下您应该直接提出这个问题。