有没有办法与sass或其他css模板语言进行模式匹配？

Question

我想用CSS显示扑克牌的图像。但如果有一种模板语言可以建立一种类似的风格，那就太好了。

.playing-card-(.*) {
   width: 30px
   height: 40px
   background-image: "/images/cards/$1.gif"
}

这样的事情存在吗？

Answer 1

我喜欢这个存在，但我必须做同样的任务，我不得不依赖服务器端将background-image编写为内联样式或使用JS来执行它（例如，如果我通过AJAX加载数据。）

Answer 2

我不知道是否有任何CSS技术可以帮到你。虽然它不理想，但您可以使用jQuery来实现这一目标：

我首先为每张卡“卡片”分配一个公共类，然后使用jQuery迭代每个项目，为元素分配合适的CSS。

$('.cards').each(function(index,element) {
  $(element).css('background-image','url(images/cards/'+index+'.gif)');
});