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作为目标生成文件,然后开发者就只要使用这种语言进行编码工作了.预处理器通 ...
随机推荐
- nginx.conf配置详解
######Nginx配置文件nginx.conf中文详解##### #定义Nginx运行的用户和用户组 user www www; #nginx进程数,建议设置为等于CPU总核心数. worker_ ...
- Thymeleaf的超链接与AJAX的跳转问题
//th:href :超链接<a th:href="@{/list}"></a>//可以在其他页面跳转yt <form id="msform ...
- Python——SQLite
一.连接数据库 import sqlite3 conn = sqlite3.connect('数据库名.db') 二.插入 import sqlite3 conn = sqlite3.connect( ...
- kubernetes 创建用户配置文件来访问集群API
创建一个账号 kubectl create serviceaccount def-ns-admin 绑定集群权限 kubectl create rolebinding def-ns-admin --c ...
- jQUERY中的属性获取
jQuery获取Select选择的Text和Value:语法解释:1. $("#select_id").change(function(){//code...}); //为Se ...
- Django 序列化
序列化 背景 对于Django 的queryset 对象在传递给 前端的时候,前端是无法识别的 因此需要存在一个转换过程将 queryset 对象转换成 字符串前端才可以识别 演示 QuerySet ...
- css at @ 规则
css相信我们都不陌生,但是我们真的对它非常了解吗? css主要分为两种规则组成: 一种被称为 at-rule,也就是 at 规则 另一种是 qualified rule,也就是普通规则 今天让我们来 ...
- Tomcat——目录结构
Tomcat目录结构:1. 一级目录 bin ——Tomcat执行脚本目录conf ——Tomcat配置文件lib ——Tomcat运行需要的库文件(JARS)logs ——Tomcat执行时的LOG ...
- Spring的事务机制
---恢复内容开始--- 内定的=>(只需要在xml 中添加一个bean) 在xml 中添加 <bean id="listener" class="com.t ...
- windows 下 bat 计划任务删除保留时间内文件
date windows 打印时间戳 年:echo %date:~,% 月:echo %date:~,% 日:echo %date:~,% 星期:echo %date:~,% 小时:echo %t ...