Less的guards and argument matching
- less guards/argument matching:
.setbackground(@number) when (@number>0){
.setbackground( @number - 1 );
.class@{number} { background-image: ~"url(backgroundimage-
@{number}.png)"; }
}
.setbackground(10); 输出以下css: .class1 {
background-image: url(backgroundimage-1.png);
}
.class2 {
background-image: url(backgroundimage-2.png);
}
.class3 {
background-image: url(backgroundimage-3.png);
}
.class4 {
background-image: url(backgroundimage-4.png);
}
.class5 {
background-image: url(backgroundimage-5.png);
}
.class6 {
background-image: url(backgroundimage-6.png);
}
.class7 {
background-image: url(backgroundimage-7.png);
}
.class8 {
background-image: url(backgroundimage-8.png);
}
.class9 {
background-image: url(backgroundimage-9.png);
}
.class10 {
background-image: url(backgroundimage-10.png);
}
- & symbol:
& symbol在less中有特殊的意义,它代表了当前selector的parent:
.class1
{
.class2{
property:;
}
}
.class1
{
.class2 & {
property:;
}
}
由于&代表了.class1所以编译后将输出以下css:
.class1 .class2 {
property:;
}
.class2 .class1 {
property:;
}
同样类似地:
.clearfix() {
&:before,
&:after {
content: " "; /* 1 */
display: table; /* 2 */
}
&:after {
clear: both;
}
} .wrapper {
.clearfix(); 该调用将自动在.wrapper:after{clear: both;}清除float影响。 注意:这里clearfix中的&指的是.wrapper
}
Less的guards and argument matching的更多相关文章
- java注释规范
前言: 现在java的出产地sun公司并没有定义一个java注释规范,注释规范目前是每个公司自己有自己的一套规范,主要是为了团队之间的协作. 1.基本规则 1.注释应该使代码更加清 ...
- Integral Promotions整数提升和符号扩展(char,unsigned char,signed char)
以下来自msdn: Objects of an integral type can be converted to another wider integral type (that is, a ty ...
- Mockito文档-单元测试技术
Overview Package Class Use Tree Deprecated Index Help PREV CLASS NEXT CLASS FRAMES ...
- Jmockit之mock特性详解
本文是Jmockit学习过程中,根据官网所列的工具特性进行解读. 1.调用次数约束(Invocation count constraints) 可以通过调用计数约束来指定预期和/或允许匹配给定期望的调 ...
- 单元测试系列:Mock工具Jmockit使用介绍
更多原创测试技术文章同步更新到微信公众号 :三国测,敬请扫码关注个人的微信号,感谢! 原文链接:http://www.cnblogs.com/zishi/p/6760272.html Mock工具Jm ...
- 单元测试系列之十一:Jmockit之mock特性详解
本文是Jmockit学习过程中,根据官网所列的工具特性进行解读. 1.调用次数约束(Invocation count constraints) 可以通过调用计数约束来指定预期和/或允许匹配给定期望的调 ...
- 单元测试系列之二:Mock工具Jmockit实战
更多原创测试技术文章同步更新到微信公众号 :三国测,敬请扫码关注个人的微信号,感谢! 原文链接:http://www.cnblogs.com/zishi/p/6760272.html Mock工具Jm ...
- IMPI Python集群运行报错:
Intel MPI环境利用hostfile多主机运行下报错 HYDU_process_mfile_token (../../utils/args/args.c:523): token slots no ...
- Ubuntu16.04 ARM 编译 编译器版本和unordered_map map问题
源文件内使用unordered_map时候,例如如下demo #include <unordered_map> void foo(const std::unordered_map<i ...
随机推荐
- Oracle触发器简单使用记录
在ORACLE系统里,触发器类似函数和过程.1.触发器类型:(一般为:语句级触发器和行级触发器.) 1).DML触发器: 创建在表上,由DML事件引发 2).instead of触发器: 创建在视图上 ...
- C#的datatable使用
// 构造datatable DataTable dt = new DataTable("test_table"); dt.Columns.AddRange(new DataCol ...
- CDH集群安装配置(一)-集群规划和NAT网络配置
三台物理机或者虚拟机. cdh1,cdh2,cdh3. 内存要求大于8GB,cdh1的物理磁盘要求多余50G. 每台虚拟机安装centos 7 系统.
- CSS box-flex属性,然后弹性盒子模型简介
今天做项目的时候发现一个css3的新属性flex 一.什么是flex 它的作用是能够按照设置好的规则来排列容器内的项目,而不必去计算每一个项目的宽度和边距.甚至是在容器的大小发生改变的时候,都可以重新 ...
- 深入理解BSS(Block Started by Symbol)
理解ELF的BSS section, 可以概括为: Uninitialized global/static data "Block Started by Symbol" " ...
- React.js 小书 Lesson22 - props.children 和容器类组件
作者:胡子大哈 原文链接:http://huziketang.com/books/react/lesson22 转载请注明出处,保留原文链接和作者信息. 有一类组件,充当了容器的作用,它定义了一种外层 ...
- POj2387——Til the Cows Come Home——————【最短路】
A - Til the Cows Come Home Time Limit:1000MS Memory Limit:65536KB 64bit IO Format:%I64d & ...
- WEB项目构建优化之自动清除CSS中的图片缓存
在web项目构建发布时,经常遇到css中图片的修改优化,那么如何清除图片的缓存成为必须要解决的问题.曾经有过傻傻的方法就是直接在图片后面添加随机数.今天主要是从构建自动化方式来解决这个问题,提高开发及 ...
- 项链(burnside)
Description 有一个长度为 \(n\) 的项链,首尾相接形成环,现在你要给每一个位置一个颜色 \([1,m]\), 求所有不同的项链个数(可以通过旋转变成一样的称为相同) Solution ...
- YII框架路由配置
首先要在服务器配置(httpd.conf)中开启重写模块: #开启重写模块,将其前面的#去掉 LoadModule rewrite_module modules/mod_rewrite.so #Dir ...