[英]Change the colour of each property in a list (HANDLEBARS JS & CSS)
使用 Handlebars 我可以显示从 Spotify 获取的艺术家列表。 我希望能够更改每个艺术家的颜色和风格,但我不知道如何将它们分开? 我该怎么做呢? 非常感谢您的帮助或为我指明正确的方向。
<script id="artists" type="text/x-handlebars-template">
<h2>artists
</h2>
<dl class="pull-left">
<dd class="text-overflow" id="artistcolumn">
<ol>
{{#each items}}
<li>{{name}}</li>
{{/each}}
</ol>
</dd>
</dl>
</script>
我尝试过使用:nth-of-type() 或artistcolumn,但它不起作用?
您可以通过设置列表的 CSS 来做到这一点。 这是一个例子:
li:nth-child(1){
color: blue;
};
li:nth-child(2){
color:orange;
};
li:nth-child(3){
color:green;
}
为每个列表条目设置颜色的另一种方法是为您呈现的每个项目添加颜色。 如果items
是一个对象数组,您可以设置items[index].color = #0000FF
然后将十六进制颜色应用于每个li
HTML 元素。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.