Css &；：在Sass不工作的情况下悬停

我正在使用SASS和bootstrap在这里创建nav，但不能让hover的伪类正常工作，有人看到我做错了什么吗

HTML:

---

有人告诉我需要添加更多细节，因为我的帖子主要是代码，所以我只是添加了这句话。

您的SASS代码正常工作，但Bootstrap定义了以下规则：

.navbar-default .navbar-nav > li > a:hover{
    color: #333;
}

因此，您需要设置一个比它更具体的规则，例如在级联链中的

a

之前添加

li

：

.navbar {
    background-color: transparent;
    border: none;
    padding-top: 3em;
    .navbar-nav {
        display: inline-block;
        float: none;
    }
    .navbar-collapse {
        text-align: center;
        li{
            a {
                width: 8em;
                font-family: 'Allan', cursive;
                font-size: 2em;
                &:hover {
                    color: #f00;
                }
            }
        }
    }
}

或者使用

！重要信息

，如：

&:hover {
    color: #f00 !important;
}

---

您的SASS代码正在工作，但引导程序已定义此规则：

.navbar-default .navbar-nav > li > a:hover{
    color: #333;
}

因此，您需要设置一个比它更具体的规则，例如在级联链中的

a

之前添加

li

：

.navbar {
    background-color: transparent;
    border: none;
    padding-top: 3em;
    .navbar-nav {
        display: inline-block;
        float: none;
    }
    .navbar-collapse {
        text-align: center;
        li{
            a {
                width: 8em;
                font-family: 'Allan', cursive;
                font-size: 2em;
                &:hover {
                    color: #f00;
                }
            }
        }
    }
}

或者使用

！重要信息

，如：

&:hover {
    color: #f00 !important;
}

---

您也可以发布html吗？“不起作用”不是对问题的适当描述。什么不起作用？您是否查看了编译后的CSS以查看它是否具有您期望的结果？是否有错误？您的代码运行正常，请参见此处@cimmanon检查编译的css总是有效的，因为它显示了在使用scss选择器等时创建的选择器。。。好的建议。你也可以发布你的html吗？“不起作用”不是对问题的恰当描述。什么不起作用？您是否查看了编译后的CSS以查看它是否具有您期望的结果？是否有错误？您的代码运行正常，请参见此处@cimmanon检查编译的css总是有效的，因为它显示了在使用scss选择器等时创建的选择器。。。很好的建议。最好使用级联覆盖规则，而不是使用

！重要提示

@Paulie\u D我同意你的观点：）最好使用级联覆盖规则，而不是使用

！重要提示

@Paulie\u我同意你的观点：）