html - 如何将 CSS 应用于 :last-child button

Question

参见下面的图片示例，我想知道如何使一行 div 中的最后一个按钮具有不同的颜色。可以在 DIV 中使用 :last-child 使用 CSS 来实现吗？

我想让最后一个按钮像下面的设计一样变成绿色:

谢谢!

HTML:

<div class="span3">
    <h3 class="icon_office">Daily office cleaning</h3>
    <p>Office, meeting rooms, communal areas, washrooms and hygiene areas.</p>
    <a class="btn btn-large btn-primary" href="#>Learn More</a>
</div>

<div class="span3">
     <h3 class="icon_retail">Retail cleaning</h3>
     <p>The cleaning and maintenance of public circulation areas, shopping centres, retail complexes etc.</p>
     <a class="btn btn-large btn-primary" href="#">Learn More</a>
</div>

<div class="span3">
     <h3 class="icon_edu">Educational cleaning</h3>
     <p>The general cleaning of all aspects of public sector establishments, schools and colleges.</p>
     <a class="btn btn-large btn-primary" href="#">Learn More</a>
</div>

<div class="span3">
    <h3 class="icon_special">Specialist cleaning</h3>
    <p>We also provide specialist cleaning and support services.</p>
    <a class="btn btn-large btn-primary" href="#">Learn More</a>
</div>

Answer 1

使用 :last-child:

.services .span3:last-child .btn {
   background : green;
}

使用相邻兄弟选择器:

.services .icon_special + p + .btn {
    background: green;
}