如何使用非选择器为元素添加css

Question

我在我的项目中使用 sass 来应用 css 样式，这里我有 div 项，其中所有 div 都有相同的类，除了少数 divs，

示例：html

<div class="wrapper-col"><p>jakajsf</p></div>
<div class="wrapper-col"><p>jakajsf</p></div>
<div class="wrapper-col"><p>jakajsf</p></div>
<div class="wrapper-col"><p>jakajsf</p></div>
<div class="wrapper-col not-wrap"><p>jakajsf</p></div>
<div class="wrapper-col"><p>jakajsf</p></div>
<div class="wrapper-col"><p>jakajsf</p></div>
<div class="wrapper-col"><p>jakajsf</p></div>
<div class="wrapper-col"><p>jakajsf</p></div>
<div class="wrapper-col not-wrap"><p>jakajsf</p></div>
<div class="wrapper-col"><p>jakajsf</p></div>

html 上面有多个类名为 wrapper-col 的 div，但很少有 div 也有类 not-wrap，我在这里有 scss，我想在其中应用类名为 wrapper-col 但不是 not-wrap 类的样式而不修改HTML

这是我尝试过的，但它不适合我。

SCSS：

.wrapper-col{
    &:not(.not-wrap){
        p{
            /* styles here*/
        }
    }
}

Answer 1

你传递的例子很好用！

添加边框为例，你会看到：https://jsfiddle.net/o7hjv1ts/1/

.wrapper-col{
    &:not(.not-wrap){
        p{
            border: 1px solid red;
        }
    }
}