我需要输出这个:
#footer-widgets .container .row {
background-image: url("RANDOMLY PICKED");
background-position: right bottom;
background-repeat: no-repeat;
}
...并且应该有一个列表,其中包含 4 或 5 个指向实际背景图像 ( http://domain.com/blablabla/image.png ) 的链接可供选择。我怎样才能用 SASS 做到这一点?
最佳答案
Sass 的最新版本 (v3.3.0)添加了新的random
函数。如果将其与图像列表(以及一点点变量插值)混合,则每次编译 Sass 时,CSS 都会随机选择背景图像。示例:
$imgKey: random(5);
$list: apple, banana, cherry, durian, eggplant;
$nth: nth($list, $imgKey);
body {
background-image: "/images/#{$nth}.jpg";
}
实例:http://sassmeister.com/gist/8966210
如上所述,随机值仅在 Sass 编译时才会更改,而不必每次访问您的页面时都会更改。
关于css - SASS:从列表中随机选择背景图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31478302/