Sass

2021-12-15  本文已影响0人  云瑶糖糖

好看的网页千篇一律,有趣的代码万里挑一。
卷卷卷
今天介绍一个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.可以定义变量。

上一篇 下一篇

猜你喜欢

热点阅读