【sass中的相同变量，不同取值如何正确的使用，才能让css代码更加简洁。 _Sass 】

sass中的相同变量，不同取值如何正确的使用，才能让css代码更加简洁。

我也踩过这个坑( 1 )

已统计您的踩坑,无需重复点击

回答(3)

Sass

详细描述

截图

代码

.back {
        position: absolute;
        left: 5%;
        top: 33%;
        display: inline-block;
        width: .3rem;
        height: .3rem;
        font-size: .36rem;
        // line-height: .88rem;
        border-top: .02rem solid #fff;
        border-right: .02rem solid #fff;
        transform: rotate(225deg);
    }

    .h-page {
        font-size: .36rem;
        line-height: .88rem;
        color: #fff;
    }

编辑于2024-11-23

时间排序

热门排序

[上海|荣耀师兄]JS-周能
0

sass的变量的话在重复使用一个值或一个简单的属性的时候就可以使用变量，通过$符号申明比如下面截图的颜色可以这样$color：#fffff 写成一个变量直接调用，还有border的样式，比如$border：.02rem solid $color 就可以使用变量，变量里面引入变量这样也可以，这里的话还可以使用混合器来把样式写好直接调用就行

查看全部>

编辑于2018-10-05
[成都|]JS-
0

比如你的宽高你可以在前面声明成这样
@mixin w-h($a,$b) {
width: $a;
height: $b;
}
然后引用的时候
@include w-h(50px, 50px);
就可以随意改变

然后你的也可以在前面声明成$border : 0.2rem solid #fff;
引用的时候直接写$border

查看全部>

编辑于2019-03-18
[成都|结业弟子]JS-彭力
0

例如项目里有很多文字要设置不同的大小和颜色，就可以使用@mixin name（$color，$size）｛color:$color; font-size:$size;｝。在不同项带入@include name（$color，$size）,填写不同值就可以简化代码了，思路大概是寻找共用属性，给属性值设置变量，在不同项填入不同属性值。

查看全部>

编辑于2019-04-28

去第页