Css 如何仅为SASS中的主要部分添加一些样式

我有这个标记：

<ul> // w style: border-top: 2px solid #aaa; border-bottom: 1px solid #ccc;
  <li>
    <ul> // w style: border-bottom: 2px solid #aaa;
      <li>
      <li>
    </ul>
  </li>
</ul>

---

我知道我可以复制标签，并在里面为他指定不同的样式，但一般来说，这种记录/写入的可能性有多大？Thx寻求帮助。

我认为您使用嵌套选择器是错误的，它一定是从Sass抛出错误。 您在包含选择器的别名之后使用了直接派生选择器

，在本例中为

ul

，因此编译后的选择器看起来像

ul>

，这是无效的

选择器应遵循模式

parent>child

。您可能正在尝试

ul

，但嵌套的

ul

不是主

ul

的直接后代，而是

li

的子代

你的修订守则：

ul {
   border-top: 2px solid #aaa;

   & > li > & {
     border-bottom: 1px solid #ccc;
   }
}

但请注意，此规则也适用于以下情况，因此您可能应该在嵌套的

ul

上查找一个类

HTML

<ul> // w style: border-top: 2px solid #aaa; border-bottom: 1px solid #ccc;
  <li>
    <ul> // w style: border-bottom: 2px solid #aaa;
      <li>
        <ul> // Another list
          <li></li>
          <li></li>
        </ul>
      <li>
    </ul>
  </li>
</ul>

---

如果不再次写入

ul

，则无法完成此操作

<ul> // w style: border-top: 2px solid #aaa; border-bottom: 1px solid #ccc;
  <li>
    <ul> // w style: border-bottom: 2px solid #aaa;
      <li>
        <ul> // Another list
          <li></li>
          <li></li>
        </ul>
      <li>
    </ul>
  </li>
</ul>

<ul> // w style: border-top: 2px solid #aaa; border-bottom: 1px solid #ccc;
  <li>
    <ul class='sub-list'> // w style: border-bottom: 2px solid #aaa;
      <li>
      <li>
    </ul>
  </li>
</ul>

ul {
  border-top: 2px solid #aaa;
}

.sub-list { /* Will inherit the above if used on a ul */
   border-bottom: 1px solid #ccc;
}