sass compact方法的实现
不想依赖compass的编译器,但sass的又没有compact方法,于是自己造轮子。最早时在stackoverflow看到一个
@function compact($var-1, $var-2: false,
$var-3: false, $var-4: false,
$var-5: false, $var-6: false,
$var-7: false, $var-8: false,
$var-9: false, $var-10: false) {
$full: $var-1;
$vars: $var-2, $var-3, $var-4, $var-5,
$var-6, $var-7, $var-8, $var-9, $var-10; @each $var in $vars {
@if $var {
$full: $full, $var;
}
}
@return $full;
} .aaa {
content: compact(1,2, null,7, 0 ,44);
}
这里有一个神奇的用法,如何将一个个元素串起一个数组($full: $full, $var)
不过太怪了,@if又不写小括号,有点像ruby。更奇怪的是,它的@if不会过滤0。下面是我造的轮子,改动不大。
@function compact($var-1, $var-2: false,
$var-3: false, $var-4: false,
$var-5: false, $var-6: false,
$var-7: false, $var-8: false,
$var-9: false, $var-10: false) {
$full:();
$vars: $var-1, $var-2, $var-3, $var-4, $var-5,
$var-6, $var-7, $var-8, $var-9, $var-10; @each $var in $vars {
@if ($var){
$full : append($full, $var, comma);
}
}
@return $full;
} .aaa {
content: compact(1,2, null,7, 0 ,44);
}
轮子3,使用可变长参数,节省大量代码。轮子越造越好,超越老外了。
@function compact($args...) {
$ret: ();
@each $i in $args{
@if($i){//if 不会过滤0
$ret: append($ret, $i, comma);
}
}
@return $ret;
}
.aaa {
content: compact(blue, red, false, green);
}
sass compact方法的实现的更多相关文章
- 关于面试题 Array.indexof() 方法的实现及思考
这是我在面试大公司时碰到的一个笔试题,当时自己云里雾里的胡写了一番,回头也曾思考过,最终没实现也就不了了之了. 昨天看到有网友说面试中也碰到过这个问题,我就重新思考了这个问题的实现方法. 对于想进大公 ...
- 2016 - 2 - 19 ARC内存管理知识总结(一,arc基本概念及alloc等方法的实现)
一. ARC的基本概念 1. 在objc中采用automatic reference counting 机制, 让编译器来进行内存管理.在降低程序崩溃,内存管理泄漏等风险的同时,很大程度减少了程序员的 ...
- 05_动手动脑之String.equals()方法的实现代码
Question: 请查看String.equals()方法的实现代码,注意学习其实现方法. Answer: java中的String.equals()方法的实现代码: equals()法是根类Obj ...
- Atitit paip.对象方法的实现原理与本质.txt
Atitit paip.对象方法的实现原理与本质.txt 对象方法是如何实现的1 数组,对象,字典1 对象方法是如何实现的 这显然是一个对象方法调用.但对象方法是如何实现的呢?在静态语言中,因为有编译 ...
- matchesSelector及低版本IE中对该方法的实现
matchesSelector用来匹配dom元素是否匹配某css selector.它为一些高级方法的实现提供了基础支持,比如事件代理,parent, closest等. W3C在2006年就提出了该 ...
- 动手动脑之查看String.equals()方法的实现代码及解释
动手动脑 请查看String.equals()方法的实现代码,注意学习其实现方法. 第一个是false,后三个是true. package stringtest; public class Strin ...
- OC:属性的内部实现原理、dealloc内释放实例变量、便利构造器方法的实现原理、collection的内存管理
代码: // // main.m #import <Foundation/Foundation.h> #import "Person.h" #import " ...
- java集合的contains(obj)方法的实现
在实际项目中我们通常会有一个需求就是:想知道在一个列表中是否包含某一个对象 这里ArrayList表.HashSet表和HashMap表都提供了一个contains(obj)方法, 下面说一下两个列表 ...
- [转]原生JS-查找相邻的元素-siblings方法的实现
在针对element的操作里,查找附近的元素是一个不可少的过程,比如在实现tab时,其中的一个div增加了“on”class,其他的去除“on”class.如果用jquery的朋友就肯定不会陌生sib ...
随机推荐
- javascript中new Date()会存在偏差一小时的bug
事件回顾: 因为我们的产品会有与时间转换这部分,并且流量主要集中在小程序. emmm~ 获取用户出生的年/月/日/时 我们和后台协商的是换算用户选择后的时间为 年/月/日/时/分/秒 所以我们 ...
- epoint:TreeView
Epoint.Web.UI.WebControls2X.EpointTreeNode 思路:就是使用递归 RootNodeText 根节点名称RootNodeUrl 根节点路径ShowRootNode ...
- ASPX 后台调用前台Js
1.UpdatePanel 使用中 protected void Button1_Click(object sender, EventArgs e) { this.Label1.Text = &quo ...
- 解决Jenkins权限配置错误,导致登录时出现没有Overall/read权限
问题 由于初次接触jenkins,于是在搭建好jenkins以后,想要对用户进行管理,于是乎开始在系统管理->configure Global Security里设置用户的权限. 在启用安全-& ...
- 20181009-7 选题 Scrum立会报告+燃尽图 06
Scrum立会报告+燃尽图(06)选题 此作业要求参见:https://edu.cnblogs.com/campus/nenu/2018fall/homework/2196 一.小组介绍 组长:刘莹莹 ...
- HTML学习3---排版标记
上节,我们学习了boda常用的属性以及HTML的一些标记,但是图显示的效果却不是那么的好看. 原因就是没有排版好,我们这次使用居中来使这个页面更好看一点,顺便多加入几个别的标记. HTML排版标记 ( ...
- java日常知识点积累
java类型中的普通非static方法 示例代码: package com.lvzhi; /** * Created by lvzhi on 2017/9/3 */ public class MyTh ...
- 递归遍历嵌套结构(多层List)中的元素 ------Python
读Python基础教程(第二版)后看到了这么一个东西,就是利用递归遍历嵌套结构中的元素. 上代码: #encoding:UTF-8 def flatten(nested): try: #不要迭代类似字 ...
- CF1061F:Lost Root(交互&概率)
The graph is called tree if it is connected and has no cycles. Suppose the tree is rooted at some ve ...
- Idea 使用 Maven 搭建 Web 项目
传送门: 袁咩咩的小小博客 Maven项目对象模型(POM),可以通过一小段描述信息来管理项目的构建,报告和文档的软件项目管理工具. 使用它来搭建项目可以省去很多操作,它不仅有依赖管理.自动生成项目站 ...