<table>
<tr><td>aaaaa</td></tr>
<tr><td>aaaaaaaaaa</td></tr>
<tr><td>aaa</td></tr>
</table>
我想讓第一行和第三行的文本正確對齊,但不是第二行,我該怎麼做?HTML Table Text Alignment
<table>
<tr><td>aaaaa</td></tr>
<tr><td>aaaaaaaaaa</td></tr>
<tr><td>aaa</td></tr>
</table>
我想讓第一行和第三行的文本正確對齊,但不是第二行,我該怎麼做?HTML Table Text Alignment
您可以使用您的HTML和使用nth-child
選擇
tr:nth-child(odd) {
text-align:right;
}
很簡單。
<table>
<tr style="text-align:right;"><td>aaaaa</td></tr>
<tr><td>aaaaaaaaaa</td></tr>
<tr style="text-align:right;><td>aaa</td></tr>
</table>
或者使用類:
<table>
<tr class="tr-right"><td>aaaaa</td></tr>
<tr><td>aaaaaaaaaa</td></tr>
<tr class="tr-right"><td>aaa</td></tr>
</table>
,並加入到CSS:
.tr-right{text-align:right;}
或者如提到的,你可以使用CSS3選擇器,但這並不能在所有的瀏覽器。
tr:nth-child(odd) {
text-align:right;
}
<table>
<thead></thead>
<tbody>
<tr class='right'><td>aaa</td></tr>
<tr><td>aaa</td></tr>
<tr class='right'><td>aaa</td></tr>
</tbody>
</table>
.rigth{
text-align:rigth;
}
這是獨特的東西;) – 2012-07-24 10:47:14
此外,在早期版本的IE – Undefined 2012-07-24 10:47:29
的@ Mr.Alien這不會工作您可能會在這裏找到更多獨特的內容:http://www.w3.org/Style/Examples/007/evenodd.en.html – 2012-07-24 10:48:08