postcss 迭代数值插件 postcss-each

码农软件 · 软件分类 · CSS框架 · 2019-04-20 21:41:53

软件介绍

postcss-each 是一个 postcss 的插件,用来迭代数值。

迭代数值:

@each $icon in foo, bar, baz {
  .icon-$(icon) {    background: url('icons/$(icon).png');
  }
}
.icon-foo {  background: url('icons/foo.png');
}.icon-bar {  background: url('icons/bar.png');
}.icon-baz {  background: url('icons/baz.png');
}

通过索引值迭代数值:

@each $val, $i in foo, bar {
  .icon-$(val) {    background: url("$(val)_$(i).png");
  }
}
.icon-foo {  background: url("foo_0.png");
}.icon-bar {  background: url("bar_1.png");
}

迭代多重数值:

@each $animal, $color in (puma, black), (sea-slug, blue) {
  .$(animal)-icon {    background-image: url('/images/$(animal).png');    border: 2px solid $color;
  }
}
.puma-icon {  background-image: url('/images/puma.png');  border: 2px solid black;  
}.sea-slug-icon {  background-image: url('/images/sea-slug.png');  border: 2px solid blue;
}


本文地址:https://codercto.com/soft/d/4027.html

复杂:信息时代的连接、机会与布局

复杂:信息时代的连接、机会与布局

罗家德 / 中信出版集团股份有限公司 / 2017-8-1 / 49.00 元

信息科技一方面创造了人们互联的需要,另一方面让人们在互联中抱团以寻找归属感,因此创造了大大小小各类群体的认同和圈子力量的兴起,即互联的同时又产生了聚群,甚至聚群间的相斥。要如何分析这张网?如何预测它的未来变化?如何在网中寻找机会,实现突围?本书提出了4个关键概念──关系、圈子、自组织与复杂系统: • 关系 关系是人与人的连接,又可以被分为强关系和弱关系。强关系就是和你拥有亲密关系的人,......一起来看看 《复杂:信息时代的连接、机会与布局》 这本书的介绍吧!

随机密码生成器
随机密码生成器

多种字符组合密码

SHA 加密
SHA 加密

SHA 加密工具