Sass使用变量,变量以$开头

$bgcolor:#f40;  background-color:$bgcolor;

如果变量需要嵌套在字符串当中就需要写在#{}之中

$direction:left; border-#{$direction}-radius:10px; 

计算、嵌套、属性嵌套  这三个可以从字面上理解,最后一个嵌套属性举个栗子

div{a:hover{color:red;}}

继承 @extend class2继承class1的属性

.class1{background-color:pink;} .class2{@extend .class1;font-size:24px;}

选择符& 

a {color: orange; &:hover {color: darken(orange,5%);}

与之对应的是脱离父级继承 @at-root 

div{@at-root a{color:red;}}  编译成css后不是 div a{color:red;} 而是a{color:red;}

编写可以重用的代码块 @mixin  使用@include命令,调用

@mixin left{float:left;clear:both;}  div{@include left;}
更重要的是他可以传入参数-例如:
@mixin left($value:10px){float:left;margin-left:$value}  div{$include left(50px)}

颜色函数

 变暗background-color:darken(#cc3, 10%)
 变亮background-color:lighten(#cc3, 10%)

函数传值计算rem

 $fsz:50;
@function rem($value){
    @return  $value/$fsz*1rem;
}之后要计算rem就直接在rem()括号中传入设置参数即可自动计算rem

插入文件  @import 

可以在.scss文件中以@import  ‘demo’ 形式引入外部sass样式文件 还可以带路径  @import  "path/a.scss";

条件语句

@if可以用来判断: p {
    @if 1 + 1 == 2 { border: 1px solid; }
    @if 5 < 3 { border: 2px dotted; }
  }
配套的还有@else命令:
     @if  lightness($color) > 30% {
    
         } @else {
        background-color: #fff;
          }

Sass常用写法的更多相关文章

  1. 转--Android按钮单击事件的四种常用写法总结

    这篇文章主要介绍了Android按钮单击事件的四种常用写法总结,比较了常见的四种写法的优劣,有不错的参考借鉴价值,需要的朋友可以参考下     很多学习Android程序设计的人都会发现每个人对代码的 ...

  2. 【Android】按钮点击事件的常用写法

    学习总结: 最近学习了Android点击事件的常用写法.点击事件会触发监听对象身上的回调,常用写法有以下四种: 方法一:使用匿名内部类. public class MainActivity exten ...

  3. MyBatis 常用写法

    MyBatis 常用写法 1.forEach 循环   forEach 元素的属性主要有 item, idnex, collection, open, separator, close. collec ...

  4. jquery常用写法简单记录

    好久不写东西了......话不多说,主要记录一下,最近做的项目中用到的js的记录(虽然特别特别简单) 一 jquery常用写法记录 jQuery(this).addClass("select ...

  5. Android按钮单击事件的四种常用写法

    这篇文章主要介绍了Android按钮单击事件的四种常用写法总结,比较了常见的四种写法的优劣,有不错的参考借鉴价值,需要的朋友可以参考下 很多学习Android程序设计的人都会发现每个人对代码的写法都有 ...

  6. angularjs中ng-class常用写法,三元表达式、评估表达式与对象写法

     壹 ❀ 引 ng-class可以说在angularjs样式开发中使用频率特别高了,这不我想利用ng-class的三元运算符的写法来定义一个样式,结果怎么都想不起来正确写法,恼羞成怒还是整理一遍吧,那 ...

  7. python time和datetime常用写法格式

    python 的time和datetime常用写法 import time from datetime import datetime from datetime import timedelta # ...

  8. mongodb java操作常用写法

    MongoDB 将数据存储为一个文档,数据结构由键值(key=>value)对组成.MongoDB 文档类似于 JSON 对象.字段值可以包含其他文档,数组及文档数组.下面介绍的是用java操作 ...

  9. JS中面向对象中的继承(常用写法)---核心部分

    1.基本概念 子类继承父类,但是不能影响父类.包括1.混合继承(构造函数+原型) 2.ES6新增class的继承. 接下来介绍,面向对象中继承的两种常用写法.即混合继承(构造函数+原型)和class继 ...

随机推荐

  1. Django---管理界面简单设置

    1.设置可选字段 为了设置某一个字段是可选的,不如说email,仅仅须要改动其相关的模型,也就是在model.py中改动模型,将email=models.EmailField(blank=True), ...

  2. 统计词语频率保存到xls

    import json import jieba.analyse as anl import xlwt # 获取待统计的文本内容 # 打开文件 f = open('zhilian.json', 'r' ...

  3. Python绘图工具matplotlib的使用(图形并茂)

    matplotlib官网文档: http://matplotlib.org/gallery.html 支持win7_64_bit的matplotlib库下载网址: http://www.lfd.uci ...

  4. InnoSQL HA Suite的实现原理与配置说明 InnoSQL的VSR功能Virtual Sync Replication MySQL 5.5版本引入了半同步复制(semi-sync replicaiton)的功能 MySQL 5.6支持了crash safe功能

    InnoSQL HA Suite的实现原理与配置说明  InnoSQL的VSR功能Virtual Sync Replication MySQL 5.5版本引入了半同步复制(semi-sync repl ...

  5. 两个list对应元素相加

    a=[1,2,3] b=[4,5,6] 现将list a与 list b按位相加,其结果为[5,7,9] 方法一: c=[a[i]+b[i] for i in range(min(len(a),len ...

  6. MySQL--教程

    登入登出 首先启动服务,然后 mysql -u root -p 命令输入密码登入. mysql退出三种方法:mysql > exit;mysql > quit;mysql > \q;

  7. iOS 网易彩票-2框架搭建-代码重构

    在上一篇中,我们基本已经把整个框架都搭建出来了,下面进行代码重构一下. 思路: 导航按钮,按下时,会变灰,那是系统自带了,通过自定义UIButton,实现按下按钮立即切换效果. MJTabBarCon ...

  8. matlab 以excel格式将字符串数组写入TXT文件

    [m, n] = size(FFoutpu);fp = fopen('FFoutpu.txt','wt');fprintf(fp, 'name CODE ROTC EBIT_EV SHIZHI ROT ...

  9. Linux基础命令---zip

    zip zip是一种最通用的文件压缩方式,使用于unix.msdos.windows.OS等系统.如果在编译zip时包含bzip 2库,zip现在也支持bzip 2压缩.当将大于4GB的文件添加到存档 ...

  10. linux基础命令---mswap

    mkswap 在Linux设备或者文件中创建交换分区,创建完成之后必须使用swapon来使用它.一般在“/etc/fstab”中有一个交换分区列表,这样开机的时候就可以使用它. 此命令的适用范围:Re ...