问题
I have a Table to style, how can I apply text-align:left;
just for the first column and text-align:right;
for the other columns?
Here my Table example:
http://jsfiddle.net/gianlucaguarini/hAv7P/
At the moment the text-align is left for all the columns.
回答1:
You need to specify the following CSS:
.table td,
.table th
{
text-align:left;
}
#right,
.table td + td,
.table th + th
{
text-align:right;
}
Example here: http://jsfiddle.net/mWeYM/
You can read more about adjacent siblings CSS selector here: http://www.w3.org/TR/CSS2/selector.html#adjacent-selectors
回答2:
You might want to look at the :first-child
pseudo-class (W3C definition) - this is exactly the kind of thing it was designed for. You could use it like this:
.table td {
text-align: right;
}
.table td:first-child {
text-align: left;
}
The :first-child
pseudo-class means the selector only matches the first <td>
in each <tr>
.
Example here: http://jsfiddle.net/xv5Cn/1/
回答3:
Hey Manna i have updated your fiddle just follow this link:
http://jsfiddle.net/hAv7P/9/
All you need to do is add a class to the which yu want aligned and then add css as in the fiddle
来源:https://stackoverflow.com/questions/11984767/how-to-apply-text-align-left-in-the-first-column-and-text-align-right-in-the-oth