zoukankan      html  css  js  c++  java
  • Sass Maps的函数-map-remove($map,$key)、keywords($args)

    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; }
  • 相关阅读:
    datagrid与webAPI的数据交互(ef mvc )
    ASP.Net MVC数据传递
    dagride实现模糊查询
    MVC三层架构搭建
    web实现下拉列表多选加搜索
    php入门
    mysql实现简单的增删改查,放入xmapp自带数据库中
    ghithub中PHPOffice/PHPWord的学习
    移动端一像素问题
    点击按钮返回顶部
  • 原文地址:https://www.cnblogs.com/qjuly/p/9122734.html
Copyright © 2011-2022 走看看