map-remove($map,$key)

map-remove($map,$key) 函数是用来删除当前 $map 中的某一个 $key,从而得到一个新的 map。其返回的值还是一个 map。他并不能直接从一个 map 中删除另一个 map,仅能通过删除 map 中的某个 key 得到新 map。如:

$map:map-remove($social-colors,dribble);

返回的是一个新 map:

$map:(
facebook: #3b5998,
github: #171515,
google: #db4437,
twitter: #55acee
);

如果删除的 key 并不存在于 $map 中,那么 map-remove() 函数返回的新 map 和以前的 map 一样。

$map:map-remove($social-colors,weibo);

返回的值:

$map: (
dribble: #ea4c89,
facebook: #3b5998,
github: #171515,
google: #db4437,
twitter: #55acee
);
keywords($args)

keywords($args)

keywords($args) 函数可以说是一个动态创建 map 的函数。可以通过混合宏或函数的参数变创建 map。参数也是成对出现,其中 $args 变成 key(会自动去掉$符号),而 $args 对应的值就是value。

@mixin map($args...){
@debug keywords($args);
} @include map(
$dribble: #ea4c89,
$facebook: #3b5998,
$github: #171515,
$google: #db4437,
$twitter: #55acee
);

在命令终端可以看到一个输入的 @debug 信息:

 DEBUG: (dribble: #ea4c89, facebook: #3b5998, github: #171515, google: #db4437, twitter: #55acee)
批量的给小图标改颜色(多皮肤设置也可以)

 1 @mixin bgColors($args...){//表示传入多个参数,用了“...”符号
2
3   $list: keywords($args);
4
5   @each $x,$y in $list{//用一个each,循环变量colors列表里的键值对
6
7     .bg_#{$x}{
8
9       background-color:#{$y};
10     }
11   }
12
13 }
14
15 @include bgColors(//调用函数,并传入需要设置值得参数
16
17   $weibo: #f00,
18
19   $QQ : #0f0,
20
21   $weixin: #00f,
22
23   $github: #000
24
25 )

编译后:

 1 .bg_weibo {
2
3 background-color: #f00; }
4
5 .bg_QQ {
6
7 background-color: #0f0; }
8
9 .bg_weixin {
10
11 background-color: #00f; }
12
13 .bg_github {
14
15 background-color: #000; }

Sass Maps的函数-map-remove($map,$key)、keywords($args)的更多相关文章

  1. Sass Maps的函数-map-keys($map)

    map-keys($map) 函数将会返回 $map 中的所有 key.这些值赋予给一个变量,那他就是一个列表.如: map-keys($social-colors); 其返回的值为: "d ...

  2. Sass函数:Sass Maps的函数-map-has-key($map,$key)

    map-has-key($map,$key) 函数将返回一个布尔值.当 $map 中有这个 $key,则函数返回 true,否则返回 false. 前面的示例,当 $key 不在 $map 中时,使用 ...

  3. Sass Maps的函数-map-values($map)、map-merge($map1,$map2)

    map-values($map) map-values($map) 函数类似于 map-keys($map) 功能,不同的是 map-values($map )获取的是 $map 的所有 value ...

  4. Sass函数:Sass Maps的函数-map-get($map,$key)

    map-get($map,$key) 函数的作用是根据 $key 参数,返回 $key 在 $map 中对应的 value 值.如果 $key 不存在 $map中,将返回 null 值.此函数包括两个 ...

  5. 内置函数--sorted,filter,map

    sorted() 排序函数. 语法: sorted(Iterable, key=None, reverse=False) Iterable: 可迭代对象;  key: 排序规则(排序函数); reve ...

  6. python--函数式编程 (高阶函数(map , reduce ,filter,sorted),匿名函数(lambda))

    1.1函数式编程 面向过程编程:我们通过把大段代码拆成函数,通过一层一层的函数,可以把复杂的任务分解成简单的任务,这种一步一步的分解可以称之为面向过程的程序设计.函数就是面向过程的程序设计的基本单元. ...

  7. C++ STL中Map的按Key排序和按Value排序

    map是用来存放<key, value>键值对的数据结构,可以很方便快速的根据key查到相应的value.假如存储学生和其成绩(假定不存在重名,当然可以对重名加以区 分),我们用map来进 ...

  8. python笔记十四(高阶函数——map/reduce、filter、sorted)

    一.map/reduce 1.map() map(f,iterable),将一个iterable对象一次作用于函数f,并返回一个迭代器. >>> def f(x): #定义一个函数 ...

  9. C++ STL中Map的按Key排序跟按Value排序

    C++ STL中Map的按Key排序和按Value排序 map是用来存放<key, value>键值对的数据结构,可以很方便快速的根据key查到相应的value.假如存储学生和其成绩(假定 ...

随机推荐

  1. 4412 使用usb摄像头拍照YUYV格式

    一.内核设置 Linux内核中已经带有很完善的USB摄像头驱动,支持几乎所有的USB摄像头,我们只需要配置内核,选择上相应的Sensor型号即可. 配置内核,支持USB摄像头: Device Driv ...

  2. [CF846D]Monitor题解

    看了一眼这题所用的操作,我觉得二维树状数组珂做,然后发现如果按时间顺序把节点一个个加进去再判会TLE,但发现二分时间明显比刚刚的做法快,于是二分时间+暴力插入该时间之内的点+树状数组维护即可AC 贴个 ...

  3. vue项目适应不同屏幕做的适配器

    一般宽度是1920的,但是有的电脑屏幕很窄,导致页面样式错乱,那么可以设置app.vue以及主页面里的样式宽度为1920px,超过了就auto. 如下: (app.vue) (home.vue) 原效 ...

  4. [CSP-S模拟测试]:Graph(图论+贪心)

    题目描述 给定一张$n$个点$m$条边的无向图,每条边连接两个顶点,保证无重边自环,不保证连通你想在这张图上进行若干次旅游,每次旅游可以任选一个点$x$作为起点,再走到一个与 $x$直接有边相连的点$ ...

  5. sql-hive笔试题整理 1 (学生表-成绩表-课程表-教师表)

    题记:一直在写各种sql查询语句,最长的有一百多行,自信什么需求都可以接,可......,想了想,可能一直在固定的场景下写,平时也是以满足实际需求为目的,竟不知道应试的题都是怎么出的,又应该怎么做.遂 ...

  6. Linux远程登录工具XShell安装

    Xshell就是一个远程控制RHEL的软件:其他的还有很多,用什么都无所谓(根据公司情况). 下面我们来安装下这个工具: 双击exe 点下一步: 选 免费的 然后下一步:(免费的功能足够用了) 点接受 ...

  7. 关于web开发中路径的问题的总结

    web开发中的一个困扰web开发新人的是路径问题: 1:项目的静态资源的根路径:http://localhost:8080/sqec-monitor 即是部署在web服务器中(比如tomcat)中项目 ...

  8. PHP-图片处理

    开启 GD 扩展(php_gd2.dll) 创建画布 画布:一种资源型数据,可以操作的图像资源. 创建新画布(新建) ImageCreate(宽,高); 创建基于调色板的画布. imageCreate ...

  9. Hugo - 安装、设置及使用

    Hugo 官方主页:https://gohugo.io 待选主题: https://github.com/cdipaolo/gindoro https://github.com/oserz/hugo- ...

  10. 应用安全-Web安全-漏洞修复方案整理

    通过HTTP头部字段防御措施整理 X-Frame-Options #反劫持 X-XSS-Protection #开启浏览器防XSS功能 Set X-Frame-Options  CSP X-Conte ...