Question

我使用的是Modernizr，它在touch标记上设置了no-touch或<html>类。现在我使用SASS并在嵌套子句中

li:hover {
  // ...
}

我想仅在no-touch标记上有html时才应用此定义。

.no-touch li:hover {
  // ...
}

不起作用，因为它在根上。是否有SASS简写或方法来获得我想要的东西，而不是在所有定义之外创建一个全新的CSS规则。

<html class="no-touch">
  <body>
    <div>
    <!-- a lot of HTML -->
               <ul>
                 <li> ... </li>
               </ul>
    <!-- /a lot of HTML -->
    </div>
  </body>
</html>

如果我像这样使用&运算符：

 &.no-touch {
   li:hover {

 }

它会将no-touch规则仅附加到周围的ul元素，从而生成以下生成的CSS：

 ul.no-touch li:hover {

 }

由于no-touch定义在<html>而非<ul>

，因此未涵盖此案例

也取自SASS文件：

＆安培;将被替换为CSS
中显示的父选择器

父选择器不引用<html>标记

应用li：仅当html具有“无触摸”等级时才悬停

0 个答案: