我可以为列创建特定规则吗？

Question

我创建了 3 组不同的列，但我希望能够以不同的方式设置每列的样式。

<div id="container">
    <div class="first">
        <div class="column">Featured Work</div>
        <div class="column">info</div>    
        <div class="column">info</div>
    </div>

    <div class="middle">
        <div class="column">News</div>
        <div class="column">middle column</div>    
        <div class="column">right column</div>
    </div>

    <div class="footer">
        <div class="column">body copy 1</div>
        <div class="column">body copy 2</div>    
        <div class="column">body copy 3</div>
    </div>

这是我当前的代码：http://jsfiddle.net/TroyAlford/Cj6dj/2/

我想设置带有顶部和底部边框的 featured work 和 news 列的样式，并设置类型的样式。两个 Info 列以及 middle 和 Right 列周围将有完整的边界。

我是否可以将每个类重命名为唯一的名称来达到这种效果？

Answer 1

您可以使用 :first-child 选择器 - DEMO

#container .first div.column:first-child,
#container .middle div.column:first-child {
    border-width: 1px 0;
    color: #c00;
}