在变量赋值之前, 利用!default为变量指定默认值。

  也就是说,如果在此之前变量已经赋值,那就不使用默认值,如果没有赋值,则使用默认值。

  代码实例如下:

$content: "antzone" !default;
#main {
content: $content;
}

  编译为css代码如下:

#main {
content: "antzone";
}

  由于在声明默认值之前,并没有变量的赋值,所以就使用默认值。

  再来看一段代码实例:

$content:"softwhy.com";
$content: "antzone" !default;
#main {
content: $content;
}

  编译成css代码如下:

#main {
content: "softwhy.com";
}

  由于在默认变量值声明之前,就已经有变量赋值了,所以就不再使用默认值。

  !default一个重要的作用就是,如果我们引入的他人scss文件中的变量有默认值的设置,那么我们就可以很灵活的来修改这些默认值,只要在这些导入文件之前引入就一个配置scss文件即可,而无需修改他人的scss文件,例如:

@import "config";
@import "variables";
@import "mixins";

  只要将重新配置的变量值写入config.scss文件,即可实现修改variables.scss和mixins.scss中默认变量值。

scss-!default默认变量的更多相关文章

  1. 如何在 SCSS 使用 JavaScript 变量/scss全局变量

    Update2019/3/6:发现一个更好的方法,预处理器加载一个全局设置文件 官方github给出了详细的配置. 在 SCSS 中使用变量很方便,创建一个 variables.scss 文件,里面声 ...

  2. dubbo的一些默认变量

    dubbo默认变量表 变量名 描述 默认值 用途 DEFAULT_IO_THREADS 默认IO线程 Math.min(Runtime.getRuntime().availableProcessors ...

  3. shell编程 Shell script 的默认变量($0, $1...)

    Shell script 的默认变量($0, $1...) 我们知道指令可以带有选项与参数,例如 ls -la 可以察看包含隐藏文件的所有属性与权限.那么 shell script 能不能在脚本文件名 ...

  4. 批量修改Ms SqlServer 的default(默认值)

    原文:批量修改Ms SqlServer 的default(默认值) --1.取得数据库所有表的默认值: select t3.name as 表名,t1.name as 字段名,t2.text as 默 ...

  5. MySql -- default 默认约束

    常用数据库约束: 一.default 默认约束: 二.not null:非空约束,指定某列不为NULL: 三.unique:唯一约束,指定某列和几列组合的数据不能重复: 四.primary key:主 ...

  6. scss 覆盖 原有变量

    在scss的variables.scss 中会有很多的变量 $color: red !default; $body-color: $color !default; 这些!default 和我们理解的! ...

  7. 访问权限系列一(public/private/protected/default):成员变量

    通过两个程序包对自身或互相之间的访问,得到结果.(先编译Test_01,得到class文件,通过Test的集中访问情况) 如下Test.java中内容: package com.java; /* * ...

  8. Lombok的使用详解(最详尽的解释,覆盖讲解所有可用注解),解决@Builder.Default默认值问题

    原文:https://blog.csdn.net/f641385712/article/details/82081900 前言 Lombok是一款Java开发插件,使得Java开发者可以通过其定义的一 ...

  9. React项目中使用less/scss&全局样式/变量

    使用create-react-app脚手架搭建初始化项目 > npm install -g create-react-app > npx create-react-app my-app c ...

随机推荐

  1. js Array属性和用法

    //构造函数创建数组 var arr1=new Array(); //字面量的方式 var arr2=[]; 1.Array.isArray(对象)---->判断这个对象是不是数组 //判断对象 ...

  2. jquery实现淘宝动态图展示商品

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  3. 自己写的一个ASP.NET服务器控件Repeater和GridView分页类

    不墨迹,直接上代码 using System; using System.Collections.Generic; using System.Linq; using System.Text; usin ...

  4. 使用 v-model 实现 双向绑定.(子组件和父组件.)

    vue 自定义组件 v-model双向绑定. 父子组件同步通信   父子组件通信,都是单项的,很多时候需要双向通信.方法如下: 1.父组件使用:msg.sync="aa"  子组件 ...

  5. C++_函数2-内联函数

    内联函数的目的是为了提高程序运行速度所做的一项改进. 常规函数与内联函数的区别不在于编写方式,而在于C++编译器如何将它们组合到程序中. 编译过程的最终产品是:可执行程序,由一组机器语言指令组成.运行 ...

  6. LeetCode4. 两个排序数组的中位数

    4. 两个排序数组的中位数 问题描述 There are two sorted arrays nums1 and nums2 of size m and n respectively.Find the ...

  7. docker image rm ubuntu 失败

    [root@hadoop14 ~]# docker image rm ubuntu Failed to remove image (ubuntu:v2): Error response from da ...

  8. 关于webpack 以及 webpack配置和常用插件的学习记录 (1)

    主要概念: Entry :   webpack的入口,构建的第一步从entry开始. Output :   输出,经过webpack处理后的得到最终想要的代码. Loader :   模块转换工具,把 ...

  9. CFD

                                                        Were  it free , it would Soar , cloud Sky. 1. 明显 ...

  10. Axure8.0

    1.Axure的一行三列的基本布局. 2.自适应页面设置,页面设置? 3.自动生成HTML的工具栏使用.生产的目录文件夹的内容. 4.元件的交互(样式修改,显示隐藏) 5.全局变量,钢笔工具的使用