zoukankan      html  css  js  c++  java
  • Sass Maps的函数-map-values($map)、map-merge($map1,$map2)

    map-values($map)

    map-values($map) 函数类似于 map-keys($map) 功能,不同的是 map-values($map )获取的是 $map 的所有 value 值,可以说也将是一个列表。而且,map-values($map) 中如果有相同的 value 也将会全部获取出来。

    如前面的示例,使用:

    map-values($social-colors)

    将会返回:

    #ea4c89,#3b5998,#171515,#db4437,#55acee

    值与值之前同样用逗号分隔。

    map-merge($map1,$map2)

    map-merge($map1,$map2)

    map-merge($map1,$map2) 函数是将 $map1 和 $map2 合并,然后得到一个新的 $map。如果你要快速将新的值插入到 $map 中的话,这种方法是最佳方法。假设我们有两个 $map:

    $color: (
        text: #f36,
        link: #f63,
        border: #ddd,
        backround: #fff
    );
    $typo:(
        font-size: 12px,
        line-height: 1.6
    );

    如果希望将这两个 $map 合并成一个 map,我们只要这样做:

    $newmap: map-merge($color,$typo);

    将会生成一个新的 map:

    $newmap:(
        text: #f36,
        link: #f63,
        border: #ddd,
        background: #fff,
        font-size: 12px,
        line-height: 1.6
    );

    这样你就可以借助 map-get( ) 等函数做其他事情了。

    不过有一点需要注意,如果 $map1 和 $map2 中有相同的 $key 名,那么将 $map2 中的 $key 会取代 $map1 中的:

    $color: (
        text: #f36,
        link: #f63,
        border: #ddd,
        backround: #fff
    );
    $typo:(
        font-size: 12px,
        line-height: 1.6,
        border: #ccc,
        background: #000
    );

    执行:

    $newmap: map-merge($color,$typo);

    得到的新 map:

    header {
      @each $key, $value in $newmap {
        #{$key}:#{$value}
      }
    }
    $newmap:(
        text: #f36,
        link: #f63,
        font-size: 12px,
        line-height: 1.6,
        border: #ccc,
        background: #000
    );
  • 相关阅读:
    linux内核中如何访问寄存器?
    uboot加载itb文件后提示"ERROR: new format image overwritten"如何处理?
    如何单独编译Linux内核源码中的驱动为可加载模块?
    openwrt如何打开linux内核的CONFIG_DEVMEM选项?
    openwrt的shell下如何访问寄存器的内容?
    linux系统错误码大全
    第 3 章 文本元素
    第 2 章 基本格式
    第 1 章 HTML5 概述
    第 20 章 项目实战--案例和关于[7]
  • 原文地址:https://www.cnblogs.com/qjuly/p/9122014.html
Copyright © 2011-2022 走看看