この例では、子要素の不透明度を変更せずに、親要素をより透明にしようとしています。
これは私の現在の CSS スタイルです:
CSS でこの効果を実現することは可能ですか?
CSS not を使用できます。
not
子は常に親の不透明度の影響を受けるため、子に異なる不透明度を与える最も簡単な方法は、子要素を兄弟要素にして、2 番目の要素を最初の要素の上に絶対的に配置して、各要素に独自の不透明度を与えることです。親のラッピング div からの相対位置に注意してください。
ここでは、あたかも子要素であるかのように、赤の div の後ろに緑の div が上にあるテキストを表示していますが、実際には兄弟要素であるため、赤の div の影響の不透明度の影響を受けません。したがって、テキストは赤い div を通して表示されますが、緑の div を通しては表示されません。
CSS
リーリーnot
を使用できます。子は常に親の不透明度の影響を受けるため、子に異なる不透明度を与える最も簡単な方法は、子要素を兄弟要素にして、2 番目の要素を最初の要素の上に絶対的に配置して、各要素に独自の不透明度を与えることです。親のラッピング div からの相対位置に注意してください。
ここでは、あたかも子要素であるかのように、赤の div の後ろに緑の div が上にあるテキストを表示していますが、実際には兄弟要素であるため、赤の div の影響の不透明度の影響を受けません。したがって、テキストは赤い div を通して表示されますが、緑の div を通しては表示されません。