好看的网页千篇一律,有趣的代码万里挑一。
卷卷卷
今天介绍一个css插件:
Sass 是世界上最成熟、稳定、强大的专业级 CSS 扩展语言。
sass官网[sass官网](https://sass.bootcss.com/)
安装
npm install sass sass-loader@8 -D
使用
<style scoped lang="scss">
// lang="scss" 就表示下面的样式采用的sass语法编写。
// 定义变量
$c1:darksalmon;
$c2:cornflowerblue;
// 定义嵌套样式
.main{
border: 1px solid black;
margin-top: 10px;
padding: 5px;
h2{
color: $c2;
}
.one{
border: 1px dashed darkgreen;
padding: 5px;
h2{
color: $c1;
//&符号表示当前元素
&.first{
font-size: 40px;
}
}
}
}
</style>
两大亮点:
1.可以嵌套编写。
2.可以定义变量。
网友评论