css - 如何在第一列中应用文本左对齐并在其他列中应用文本右对齐

Question

我有一个要设置样式的表格，我如何text-align:left;只为第一列和text-align:right;其他列应用？

这是我的表格示例：

http://jsfiddle.net/gianlucaguarini/hAv7P/

目前，所有列都保留了文本对齐。

Answer 1

您可能想查看:first-child伪类（W3C 定义）——这正是它的设计目的。你可以像这样使用它：

.table td {
    text-align: right;
}

.table td:first-child {
    text-align: left;
}​

:first-child伪类意味着选择器只匹配<td>each中的第一个<tr>。

这里的例子：http: //jsfiddle.net/xv5Cn/1/

Answer 2

您需要指定以下 CSS：

.table td,
.table th
{
    text-align:left;
}

#right,
.table td + td,
.table th + th
{
    text-align:right;
}

这里的例子：http: //jsfiddle.net/mWeYM/

您可以在此处阅读有关相邻兄弟 CSS 选择器的更多信息：http: //www.w3.org/TR/CSS2/selector.html#adjacent-selectors

Answer 3

嘿，曼娜，我已经更新了你的小提琴，只需点击以下链接：

http://jsfiddle.net/hAv7P/9/

您需要做的就是向您想要对齐的类添加一个类，然后像小提琴中一样添加css