本文共 2113 字，大约阅读时间需要 7 分钟。

@charset "utf-8";//注释内容--单行注释/* 注释内容--多行注释*/// @import "reset.css";// @import url(reset.css);@import url("reset.css");// 变量@col: #f0f;@le: left;// 作为属性值引用.box{    width: 100px;    height: 100px;    background: @col;}//作为属性名称引用：.box{    // border-left: 5px dotted #000;    border-@{le}: 5px dotted #000;}//作为选择器名称引用：// .left{ }.@{le}{    height: 50px;    background: yellow;}// 混入// 1、混入类名.bw{    width: 300px;}.bBor(){    border: 5px solid #000;}.wrap{    .bw;    .bBor;    height: 50px;    background: pink;}//2、混入参数    //不带默认值的混入.boRa(@radius){//@radius形参      border-radius: @radius;}.wrap2{    width: 200px;    height: 200px;    background: @col;    .boRa(50px);//50px 实参    @radius: 50px;    .boRa(20px);//@radius: 20px;    // .boRa;}    //带默认值的混入.bh(@bheight:50px){    height: @bheight;    background: @col;    border-top: 2px solid #000;}.wrap3{    .bh;    .bh(100px);//@bheight: 100px;}    //使用@arguments引用所有的传入的参数.boSha(@bx,@by,@bb,@bc){    box-shadow: @arguments;}.bo(@bwi:10px,@bs:solid,@bcol:#0f0){    border: @arguments;}.wrap3{    .boSha(10px,10px,20px,#000);    // .boSha(10px,20px,#000);    .bo;    .bo(5px);    .bo(5px,dotted);    .bo(5px,dashed,#000);    // .bo(#f00);}//嵌套：    //选择器嵌套.wrap4{    background: yellow;    h3{        font: 30px "微软雅黑";        color: @col;    }    .box{        background: pink;        h4{            font-size: 20px;        }        p{            font-size: 20px;            color: blue;            a{                color: yellow;                &:hover{                    color: red;                }            }            &:hover{                a{                    background: #fff;                }            }        }    }}//继承.ftStyle{    font-style: italic;}/*.wrap5{    h3{        font-size: 50px;        &:extend(.ftStyle);    }}*/.wrap5{    h3:extend(.ftStyle){        font-size: 50px;    }}//运算：    //变量运算、数值运算@wi: 100px;.wrap6{    width: @wi + 100;    height: 200px - 100;    background: yellow;}    //颜色色值运算.wrap6{    background: #000 + 20;//#000--rgb(0,0,0) + 20 --rgb(20,20,20)-- #141414    background: #000 + 300;    background: #000 - 300;}

转载地址：https://jackiehao.blog.csdn.net/article/details/104661230 如侵犯您的版权，请留言回复原文章的地址，我们会给您删除此文章，给您带来不便请您谅解！