html - TD が左に配置され、兄弟が右に配置されたテーブルを作成するにはどうすればよいですか?

Question

HTML で正確に 1 行 (tr) と 2 列 (td) のテーブルを作成したいと考えています。

最初の td は内容を左に揃え、2 番目の td は内容を右に揃えます。どうすればいいですか？

score 2 · Accepted Answer

tr td{text-align:right}
tr td:first-child{text-align:left}

しかし、おそらく 2 つの td の代わりに th と td を使用することもできます。

score 1 · Accepted Answer

これを行うには明らかにいくつかの方法がありますが、CSS3 には、求めているものにより具体的であると思われる 2 つのオプションがあります。

隣接兄弟セレクター

td { text-align: left; }
td + td { text-align: right; }

および一般的な兄弟コンビネーター

td { text-align: left; }
td ~ td { text-align: right; }

score 0 · Accepted Answer

text-alignCSS でプロパティを設定するだけです。最初のものはデフォルトで不要なので、そのままにしておく必要があります。

&lt;table style="width:200px;">
<tr>
    <td style="text-align: left;">a</td>
    <td style="text-align: right;">b</td>
</tr>
</table>

3 に答える 3