码迷,mamicode.com
首页 > 其他好文 > 详细

SASS

时间:2016-09-15 13:42:57      阅读:148      评论:0      收藏:0      [点我收藏+]

标签:

一、      Sass (安装时从C盘开始不可有中文)

1、文件后缀名有两种,sass中不包含{}和;, scss中包含{}和;,建议使用scss的后缀名。

2、用@import导入文件,可引入scss或者css文件,区别在于scss文件会被译, css文件则不会。

3、变量

$变量名(自取):值,如果在值后面接!default表示默认变量值,如果不想用默认值,在其上面写新的申明即可,默认值不常用。

$变量名:值;

 div {属性名:$变量名;}

4、sass中使用@mixin声明混合,可以传递参数,参数名以$符号开始,多个参数以逗号分开,也可以给参数设置默认值。

声明的@mixin通过@include来调用。

混合mixin,@mixin 名称{声明},调用时使用@include 名称

主要分为三种情况:

1、无参数
@mixin all{
  width: 200px;
  height: 300px;
  background: gold;
}
div{
  @include all;
}
2、有参数(固定值)
@mixin one($width:200px,$height:500px,$background:green){
  width: $width;
  height: $height;
  background: $background;
}
div{
  @include one;
}
3、有参数(无固定值)
@mixin two($width,$height,$background){
  width: $width;
  height: $height;
  background: $background;
}
div{
  @include two(200px,50px,blue);
}

 

SASS

标签:

原文地址:http://www.cnblogs.com/durunci/p/5874597.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!