ReactJSスタイリングのすべての同様のタグを選択

Question

私は2列のテーブルを持っています。最初の列がtext-align:left、2番目がtext-align:rightとなるようにスタイルを設定したいと思います。

私はこのようなスタイルを宣言しています：

const styles = { 
    table: { 
     width: '100%', 
    } 
} 

、表は次のようになります。それを行うには

<table style={styles.table}> 
    <tr> 
    <td>Column 1</td> 
    <td>Column 2</td> 
    </tr> 
    <tr> 
    <td>Column 1</td> 
    <td>Column 2</td> 
    </tr> 
    <tr> 
    <td>Column 1</td> 
    <td>Column 2</td> 
    </tr> 
    <tr> 
    <td>Column 1</td> 
    <td>Column 2</td> 
    </tr> 
</table> 

詳細な方法は、各列のスタイルを作成することと、それらが含まれるであろう毎月<td>に一度にすべてのtd（1つの列）を選択する方法はありますか？

Answer 1

疑似クラスを使用するだけです。たとえば：

td:first-child { 
    text-align: left; 
} 
td:nth-chuld(2) { //You can use :last-child instead of :nth-child(n) in your example 
    text-align: right; 
} 

それだけでimport './styles.css'あなたのコンポーネントの初めに、ネイティブ反応していない場合やスタイリングのためのクラス名を使用します。このように：<table className='table'>...</table>。