Question

如果我使用它：

.ui-collapsible-themed-content
    .ui-listview:not(.ui-listview-inset)
        >li.ui-last-child,
.ui-collapsible-themed-content
    .ui-listview:not(.ui-listview-inset)
        >li.ui-last-child
            >a.ui-btn
                border-bottom: 1px solid $border-color

...在CSS输出中忽略逗号之前的整个部分：

.ui-collapsible-themed-content .ui-listview:not(.ui-listview-inset) > li.ui-last-child > a.ui-btn {
  border-bottom: 1px solid #a7a7a7; }

我也试过这个，认为＆符号会将父选择器（在逗号之前）放在其位置：

.ui-collapsible-themed-content
    .ui-listview:not(.ui-listview-inset)
        >li.ui-last-child,
            & >a.ui-btn
                border-bottom: 1px solid $border-color

似乎忽略了逗号。

与此相同的结果：

.ui-collapsible-themed-content
    .ui-listview:not(.ui-listview-inset)
        >li.ui-last-child,
            >a.ui-btn
                border-bottom: 1px solid $border-color

这似乎是我能找到我想要的唯一方法：

.ui-collapsible-themed-content
    .ui-listview:not(.ui-listview-inset)
        >li.ui-last-child,
            border-bottom: 1px solid $border-color
            >a.ui-btn
                border-bottom: 1px solid $border-color

这给了我：

.ui-collapsible-themed-content .ui-listview:not(.ui-listview-inset) > li.ui-last-child {
  border-bottom: 1px solid #a7a7a7; }
  .ui-collapsible-themed-content .ui-listview:not(.ui-listview-inset) > li.ui-last-child > a.ui-btn {
    border-bottom: 1px solid #a7a7a7; }

有没有办法获得相同的输出，而只列出＆＃34; border-bottom＆＃34;财产曾经？

Answer 1

您的逗号位于错误的位置。您正在寻找的是：

.ui-collapsible-themed-content
    .ui-listview:not(.ui-listview-inset)
        >li.ui-last-child
            &, >a.ui-btn
                border-bottom: 1px solid $border-color

如何在Sass选择器列表中将一个属性应用于多个后代选择器

1 个答案: