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://www.codercto.com/soft/d/4027.html

数码人类学

数码人类学

[英]丹尼尔·米勒、希瑟·A.霍斯特 / 王心远 / 人民出版社 / 2014-10 / 48.00元

人类学有两大任务,一是理解什么是人,二是理解人性是如何透过多元的文化表现出来。数码科技的蓬勃发展给这两者都带来了新的作用力。《数码人类学》向读者展示了人类与数码科技如何辩证地相互定义。最终我们试图得出一个结论,那便是“数码科技对人类到底意味着什么?” 从社交网站到数字化博物馆;从数字时代政治学到电子商务,浸润式的数码科技,给普通人的生活带来了根本性的改变。仅仅用数据来说明与理解问题显然过于太......一起来看看 《数码人类学》 这本书的介绍吧!

HTML 压缩/解压工具
HTML 压缩/解压工具

在线压缩/解压 HTML 代码

URL 编码/解码
URL 编码/解码

URL 编码/解码

RGB CMYK 转换工具
RGB CMYK 转换工具

RGB CMYK 互转工具