1只定义一次颜色

{优点：可以给变量赋予不同的值；

{缺点：变量名称更改与变量值混乱；

2变浅加深

/*颜色函数*/

.warning-box {

  background-color:lighten($color10, 93.5%);//等同于#eee

}

3HSLA

hsla(315, 100%饱和度, 50%亮度, 1)

如果想要颜色看起来更加饱和鲜艳，提高高合度跟亮度；0黑色。100%白色；

sass颜色的更多相关文章

  1. Sass 颜色函数

    /* * Sass 颜色函数 * RGB 颜色函数 * 1. rgb($red,$green,$blue):根据红.绿.蓝三个值创建一个颜色: * rgb(200,40,88) //根据r:200,g ...

  2. 2-4 Sass的函数功能-颜色函数

    RGB颜色函数-RGB()颜色函数 在 Sass 的官方文档中,列出了 Sass 的颜色函数清单,从大的方面主要分为 RGB , HSL 和 Opacity 三大函数,当然其还包括一些其他的颜色函数, ...

  3. sass、less和stylus的安装使用和入门实践

    刚 开始的时候,说实话,我很反感使用css预处理器这种新玩意的,因为其中涉及到了编程的东西,私以为很复杂,而且考虑到项目不是一天能够完成的,也很少是 一个人完成的,对于这种团队的项目开发,前端实践用c ...

  4. CSS预处理器——Sass、LESS和Stylus实践

    CSS(Cascading Style Sheet)被译为级联样式表,做为一名前端从业人员来说,这个专业名词并不陌生,在行业中通常称之为“风格样式表(Style Sheet)”,它主要是用来进行网页风 ...

  5. sass进阶篇

    @if @if 指令是一个 SassScript,它可以根据条件来处理样式块,如果条件为 true 返回一个样式块,反之 false 返回另一个样式块.在 Sass 中除了 @if 之,还可以配合 @ ...

  6. sass和less、stylus语法（2）

    6.运算符(Operations)CSS预处理器语言还具有运算的特性,其简单的讲,就是对数值型的Value(如:数字.颜色.变量等)进行加减乘除四则运算.这样的特性在CSS样式中是想都不敢想的,但在C ...

  7. sass-RGB颜色函数-RGB()颜色函数

    在 Sass 的官方文档中,列出了 Sass 的颜色函数清单,从大的方面主要分为 RGB , HSL 和 Opacity 三大函数,当然其还包括一些其他的颜色函数,比如说 adjust-color 和 ...

  8. 你所不知道的 CSS 阴影技巧与细节

    关于 CSS 阴影,之前已经有写过一篇,box-shadow 与 filter:drop-shadow 详解及奇技淫巧,介绍了一些关于 box-shadow 的用法. 最近一个新的项目,CSS-Ins ...

  9. 你所不知道的 CSS 阴影技巧与细节 滚动视差？CSS 不在话下 神奇的选择器 :focus-within 当角色转换为面试官之后 NPOI 教程 - 3.2 打印相关设置 前端XSS相关整理 委托入门案例

    你所不知道的 CSS 阴影技巧与细节   关于 CSS 阴影,之前已经有写过一篇,box-shadow 与 filter:drop-shadow 详解及奇技淫巧,介绍了一些关于 box-shadow  ...

随机推荐

  1. 11i - 12 How To Set Email Style Preference For All Users At Once?

    (文档 ID 578574.1) In this Document   Goal   Solution   Workflow Information Center, Diagnostics, & ...

  2. php Debugging with Xdebug and Sublime Text 3(转)

    Debugging – we all do it a lot. Writing code perfectly the first time around is hard and only a few ...

  3. JSP总结2 配置开发环境和firstjsp

    JDK的下载 JAVA_HOME ,CLASSPATH,PATH 的配置,根据安装路径. 然后java -version检测配置OK. 编写helloworld.java   放置在同JDK 盘里.j ...

  4. su普通用户切换root用户失败

    http://blog.itpub.net/26432034/viewspace-1688391/ http://blog.csdn.net/zhangdaiscott/article/details ...

  5. vector 汇总

    Vector成员函数 函数 表述 c.assign(beg,end) c.assign(n,elem) 将[beg; end)区间中的数据赋值给c. 将n个elem的拷贝赋值给c. c.at(idx) ...

  6. Qt 小技巧之“To-Do 事项”

    Qt Creator 2.5 版本的时候增加了这个插件 一直没怎么用到 现在想起来 google了一下 做个总结吧 先晒图 就是这样啦 用法也很简单 在项目的随便一个位置 写一个注释 只要以上面5个关 ...

  7. 使用runtime 实现weex 跳转原生页面

    一.简述 最近项目组打算引入weex,并选定了一个页面进行试水.页面很简单,主要是获取数据渲染页面,并可以跳转到指定的页面.跟之前使用RN 相比,weex 确实要简单很多.从下图中我们可以看到,wee ...

  8. wamp启动mysql的命令

    输入net start mysql提示服务名无效是因为在wamp集成安装中,mysql的服务名字是叫wampmysqld,可以用net start查看服务列表.所以命令启动mysql就应该输入net ...

  9. ASCII码排序,hdu-2000

    Problem Description 输入三个字符后,按各字符的ASCII码从小到大的顺序输出这三个字符.   Input 输入数据有多组,每组占一行,有三个字符组成,之间无空格.   Output ...

  10. Linux下 nginx + 最新版php5.5 安装配置详解

    1.nginx的安装: 首先nginx的安装需要依赖最基础的三个包,这里面我们不设计更多的扩展模块,只是安装最基础的三个包, zlib 此包主要是对http内容进行gzip压缩,减少网络传输流量 PC ...