- 背景色の反転: 要素の背景色を反転させるには、以下のようなCSSを使用します。
.my-element {
background-color: black;
color: white;
}
.my-element.inverted {
background-color: white;
color: black;
}
上記の例では、.my-element
クラスを持つ要素の背景色とテキスト色を黒に設定し、.inverted
クラスを追加することで背景色とテキスト色を白に反転させます。
- テキストの反転: 要素内のテキストを反転させるには、以下のようなCSSを使用します。
.my-element {
color: black;
}
.my-element.inverted {
color: white;
}
上記の例では、.my-element
クラスを持つ要素のテキスト色を黒に設定し、.inverted
クラスを追加することでテキスト色を白に反転させます。
これらは一般的な方法であり、他にもさまざまな要素の反転方法があります。要件に合わせて適切な方法を選択してください。