Sass 中的 css + 选择器答案

【问题标题】：css + selector in SassSass 中的 css + 选择器
【发布时间】：2018-12-04 12:40:00
【问题描述】：

我是 SASS 新手，但很享受，

我想弄清楚我是如何在 SASS 中编写这行代码的：

 li a:hover + .hidden, .hidden:hover {
   display: block; 
 }

我很困，需要一些帮助。

【问题讨论】：

您到底想弄清楚如何做不同的事情？这行不通吗？
因为 SASS 是 CSS，所以它已经用 SASS 编写了
你可以像这样嵌套它li { a { &:hover { + .hidden { your styles } } } } 我认为四层深度大约是你在 SASS 中想要的层数。
这很接近，编译为：li a:hover + .hidden, li a:hover .hidden:hover { display: block; }。但它并不完全有效，因为我需要 li a:hover 丢失
没关系，我的最后一条评论也不起作用，只需制作两个选择器。我认为从 SCSS 的角度来看，您尝试做的事情没有多大意义，您正在尝试将显示块应用于具有不同子项和状态的两个不同选择器。您可能可以做一个循环或其他事情，但在我看来，这条 css 规则不值得。

标签： css sass

【解决方案1】：

要在 sass 中实现这一点，您必须使用以下结构：

li + .hidden
    a:hover .hidden:hover
        display: block

希望能帮到你。祝你好运

【讨论】：

如果我使用它，它会编译为： li + .hidden a:hover .hidden:hover { display: block;我需要它编译为： li a:hover + .hidden, .hidden:hover { display: block; }
哦，好的。您只需将 li + .hidden 的位置更改为 .hidden + li