CSS

css 声明变量和继承

联系站长 作者:web知道 来源:未知 2019-12-13 22:22 我要评论

css 声明变量和继承...

css
*{
    --mio : #fff;
}
div{
    color : var(--mio);
}


scss
声明
$mio : #fff;
div{
    color : $mio;
}

@mixin ellipse($c) {
    display: -webkit-box;
    overflow: hidden;
    white-space: normal !important;
    text-overflow: ellipsis;
    word-wrap: break-word;
    -webkit-line-clamp: $c;
    -webkit-box-orient: vertical;
}

@include ellipse(2);
 
继承
a {
  width: 100%;
}
b {
  @extend a;
  font-size: 12px;
}

%button-reset {
   margin: 0;
}
.save {
@extend %button-reset;
color: white;
background: #blue;
}

@if lightness($color) > 30% {
    background-color: #000;
} @else {
    background-color: #fff;
}

p {
  @if 1 + 1 == 2 {
    border: 1px solid; }
  @if 5 < 3 {
    border: 2px dotted; }
}

less
@mio : #fff;
div{
    color : @mio;
}




本文如有侵犯版权请联系站长删除。

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源;3.作者投稿可能会经我们编辑修改或补充。

相关文章
网友点评
精彩导读