【saas继承没有作用 _Sass 】

saas继承没有作用

我也踩过这个坑( 1 )

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

回答(1)

Sass

详细描述

截图

代码

//变量
$eliminate:0;
$blue:#29BDE0;
$white:#FFFFFF;
$text:auto;
$font:.26rem;
$width:80%;


//混合器
@mixin flex($x:center,$y:center){
    display: flex;
    justify-content:$x;
    align-items: $y;
}
@mixin guding{
    position: fixed;
    width: 100%;
}
@mixin box($w:.51rem,$h:.6rem){
    width: $w;
    height: $h;
}

@mixin font{
    width:$width;       
    font-size: $font;
    color: #A6A6A6;
}
@mixin button{
    width: 50%;
    height: .86rem;
    border-radius: .15rem;
    font-size: .4rem;
    color: #FFFFFF;
    
}




html{
    font-size: 312.5%;
}
body{
    padding: .72rem 0 1.2rem 0;
    margin: $eliminate;
    font-size: initial;
}
p{
    margin: $eliminate;
}

/*header 眉页*/
header{
    @include flex(space-between, center);
    @include guding;
    top: 0;
    /* border半透明 */
    border-bottom: .01rem solid rgba(200,200,200,.95);
    background: $blue;
    font-size:.34rem;
    /* 字符间距 */
    letter-spacing: .04rem;
    color: $white;

    a.left-header{
        @include box;
        margin: .1rem 0 0 .2rem;
        background: url(picture/task-css12.png) no-repeat -2.2rem -1.9rem;
    }
    a.right-header{
        @include box;
        margin:.1rem .2 rem 0 0 ;
        background: url(picture/task-css12.png) no-repeat -.96rem -1.95rem;
    }
}

/*main 主体*/
div.box{
    padding-top: .29rem;
    background: $blue;

    .logo{
        @include box(3.51rem,2.1rem );
        margin: $text;
        background: url(picture/task-css12.png) no-repeat -4.16rem 0;

        .logo-font{
            position: absolute;
            margin:1.3rem 0 0 .7rem;
            font-size: .48rem;
            /* 字符间距 */
            letter-spacing: .05rem;
            color: $white;
        }
    }
    p.introduce{
        width: $width;
        margin: .3rem $text .61rem $text;
        font-size: .33rem;
        color: #FFC865;
    }
    p.time{
            width: $width;
            margin: $text;
            font-size:$font;
            color: $white;

    }
    div.center-box{
        @extend .time;
        display: flex;

        span.font{
            margin-right: .5rem;
        }
    }

}

编辑于2024-11-23

时间排序

热门排序

[上海|]JS-
0

.box.center-box{
@extend .box.time;
display: flex;
}
.box{
padding-top: .29rem;
background: $blue;

.logo{
@include box(3.51rem,2.1rem );
margin: $text;
background: url(picture/task-css12.png) no-repeat -4.16rem 0;

.logo-font{
position: absolute;
margin:1.3rem 0 0 .7rem;
font-size: .48rem;
/* 字符间距 */
letter-spacing: .05rem;
color: $white;
}
}
.introduce{
width: $width;
margin: .3rem $text .61rem $text;
font-size: .33rem;
color: #FFC865;
}
.time{
width: $width;
margin: $text;
font-size:$font;
color: $white;

}
.center-box{
@extend .time;
display: flex;

span.font{
margin-right: .5rem;
}
}

}
总感觉你的sacc写的有问题你已经给p标签命名为time，为什么还要写p.time 写了以后为什么引用的时候少个p 。@extend .time。你试试这样写么么能行吗？

查看全部>

编辑于2018-10-05

去第页