SCSS的placeholder功能

402 阅读1分钟

都知道css是怎么写的,但是为了方便且节省代码书写量,让代码看起来逻辑更清晰,简洁从来衍生出了 sass和scss的语法出来,简单的说scss就是css的加强版

scss中有一个placeholder功能,引用代码块,就是为了防止写过多重复的代码,所以可以使用这个节省书写的代码量,用法就是用 % 来定义一个公用样式。

%x{
    background:#ccc;
}

类似上面的用法
然后可以引入定义的scss文件,直接用 @extend 来调用

.box{
    @extend %x;
}

这样就可以了

值得注意的一点:这个是把.box 拷贝到定义的公用样式那里去,而不是把定义的公用样式拷贝到当前写的样式里面来