css - SASS:从列表中随机选择背景图像

我需要输出:

#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/21739839/