html - 将不同的图像添加到具有相同类的 div 元素

Question

是否可以使用 css 选择具有相同类的 div 元素并将不同的 css 属性应用于这些 div 元素。

我的 HTML:

<div class="image"><br/>a</div>

<div class="image"><br/>b</div>

<div class="image"><br/>c</div>

CSS:

div.image:before {
   content:url(http://placehold.it/350x150);
}

//want to show different image for the three divs in html

JSfiddle:http://jsfiddle.net/htfhjzbo/1/

Answer 1

你可以使用nth of type selector

.image:nth-of-type(2) {
    background: #ff0000;
}

<div class="image"><br/>a</div>

<div class="image"><br/>b</div>

<div class="image"><br/>c</div>