sass进阶—函数
/*内置函数*/
/*1)常规的rgb,rgba函数*/
$color:rgb(255,255,162);
body{
color: $color;
background-color:rgba($color, 0.5);
/*2)lighten,darken函数*/
span{
color: darken($color,0.4);//颜色加深0.4倍
background-color: lighten($color,0.5);//颜色变浅0.5倍。
}
}
/*str-length(),str-index() 下标是从1开始的而不是0*/
$str:'beautiful';
p{
z-index: str-length($str);
z-index: str-index($str,'f');
}
/*自定义function*/
@function double($width){
@return $width * 2;
}
a{
width: double(10px);
}
/*@warn,@debug,@error 主要用于输出*/
@debug 'this is a debug test';/*在控制台看结果*/
@warn 'warn';
/*实例:自定义一个函数,通过给定的层次,获取特定的z-index*/
sass进阶—函数的更多相关文章
- css预编译--sass进阶篇
基础篇中主要介绍了一些sass的基本特性,进阶篇中,主要是写一些我们常用的sass控制命令,函数和规则. 控制命令 可能看过基础篇的朋友会发现在有些代码中出现@if @else @each等,熟悉JS ...
- 2-4 Sass的函数功能-颜色函数
RGB颜色函数-RGB()颜色函数 在 Sass 的官方文档中,列出了 Sass 的颜色函数清单,从大的方面主要分为 RGB , HSL 和 Opacity 三大函数,当然其还包括一些其他的颜色函数, ...
- 2-2 Sass的函数功能-字符串与数字函数
Sass的函数简介 在 Sass 中除了可以定义变量,具有 @extend.%placeholder 和 mixins 等特性之外,还自备了一系列的函数功能.其主要包括: 字符串函数 数字函数 列表函 ...
- Sass 颜色函数
/* * Sass 颜色函数 * RGB 颜色函数 * 1. rgb($red,$green,$blue):根据红.绿.蓝三个值创建一个颜色: * rgb(200,40,88) //根据r:200,g ...
- Python进阶-函数默认参数
Python进阶-函数默认参数 写在前面 如非特别说明,下文均基于Python3 一.默认参数 python为了简化函数的调用,提供了默认参数机制: def pow(x, n = 2): r = 1 ...
- sass进阶篇
@if @if 指令是一个 SassScript,它可以根据条件来处理样式块,如果条件为 true 返回一个样式块,反之 false 返回另一个样式块.在 Sass 中除了 @if 之,还可以配合 @ ...
- 【Sass/SCSS】我花4小时整理了的Sass的函数
[Sass/SCSS]我花4小时整理了的Sass的函数 博客说明 文章所涉及的资料来自互联网整理和个人总结,意在于个人学习和经验汇总,如有什么地方侵权,请联系本人删除,谢谢! 说明 Sass 定义了各 ...
- Sass进阶之路,之二(进阶篇)
Sass之二(进阶篇) 1. 数据类型 1.1 Number 数字类型,小数类型,带有像素单位的数字类型,全部都属于Number类型 Number类型详情请点击这里,下面是小例子 1.$n1: 1.2 ...
- Sass进阶之路,之一(基础篇)
Sass 学习Sass之前,应该要知道css预处理器这个东西,css预处理器是什么呢? Css预处理器定义了一种新的语言将Css作为目标生成文件,然后开发者就只要使用这种语言进行编码工作了.预处理器通 ...
随机推荐
- RPC框架原理简述:从实现一个简易RPCFramework说起(转)
摘要: 本文阐述了RPC框架与远程调用的产生背景,介绍了RPC的基本概念和使用背景,之后手动实现了简易的RPC框架并佐以实例进行演示,以便让各位看官对RPC有一个感性.清晰和完整的认识,最后讨论了RP ...
- 时间插件--daterangepicker使用和配置详解
1.序言: daterangepicker是Bootstrap的一个时间组件,使用很方便 用于选择日期范围的JavaScript组件. 设计用于Bootstrap CSS框架. 它最初是为了改善报表而 ...
- 尝试dapper和postgresql
大多数地方和其他数据库(MySQL)没有什么不同.只有几点要注意: 1.PostgreSQL表名和字段是区分大小写的,大小写不对会说字段不存在 2.插入Json数据时,要在字符串后面加上::json ...
- 使用chrome开发者工具中的network面板测量网站网络性能
前面的话 Chrome 开发者工具是一套内置于Google Chrome中的Web开发和调试工具,可用来对网站进行迭代.调试和分析.使用 Network 面板测量网站网络性能.本文将详细介绍chrom ...
- python之数据类型补充、集合、深浅copy
一.内容回顾 代码块: 一个函数,一个模块,一个类,一个文件,交互模式下,每一行就是一个代码块. is == id id()查询对象的内存地址 == 比较的是两边的数值. is 比较的是两边的内存地址 ...
- python之路day06--python2/3小区别,小数据池的概念,编码的进阶str转为bytes类型,编码和解码
python2#print() print'abc'#range() xrange()生成器#raw_input() python3# print('abc')# range()# input() = ...
- Dubbo2.6.5+Nacos注册中心(代替Zookeeper)
在上一节的小栗子的基础上,只需要更改两个地方 第一个:父工程的pom依赖增加 <!-- Dubbo Nacos registry dependency --> <dependency ...
- Aerospike-内存和硬盘混合存储的kv数据库
为什么会有Aerospike? Redis是一个纯内存型数据库,性能上没有多大问题. 但这又带来一个新问题,内存是很贵的,所以全内存的存储成本非常昂贵.为了节省成本,我们需要把一部分不经常用到的数据存 ...
- R语言统计学习-1简介
一. 统计学习概述 统计学习是指一组用于理解数据和建模的工具集.这些工具可分为有监督或无监督.1.监督学习:用于根据一个或多个输入预测或估计输出.常用于商业.医学.天体物理学和公共政策等领域.2.无监 ...
- 基于Rabbit实现的RPC
最近在学习项目中的通用技术,其中一个是在项目中会经常使用的基于RabbitMQ实现的RPC.这里一共有三个点要学习,分别是:RPC是什么?RabbitMQ是什么?如何使用RabbitMQ实现RPC.奔 ...