ホームページ > 記事 > ウェブフロントエンド > 以下に、提供された記事に基づいた質問ベースのタイトルをいくつか示します。 フォーマル
子要素の継承された不透明度をオーバーライドする
CSS では、要素は親要素から不透明度を継承します。子の元の外観を維持しながら親の不透明度のみを調整するには、次の方法を検討してください。
1.不透明度の計算:
不透明度の値は乗算されます。これは、不透明度 0.6 の親内にある不透明度 0.5 の要素は、実効不透明度 0.3 (0.5 * 0.6) を持つことを意味します。
例:
<code class="css">#parent { opacity: 0.6; } #child { opacity: 1; }</code>
この例では、親要素が半透明であっても、#child 要素は不透明に表示されます。
2.子の位置を変更する:
可能であれば、#child 要素を #parent 要素の外側に移動します。これにより、子が親の不透明度を継承することがなくなります。
3.子に RGBA カラーを使用する:
親に直接不透明度を設定する代わりに、子要素の背景、境界線、またはフォントに RGBA カラーを使用します。 RGBA カラーは、不透明度を 4 番目の値として指定します。
<code class="css">#child { background-color: rgba(255, 165, 0, 0.5); }</code>
追加の注意事項:
以上が以下に、提供された記事に基づいた質問ベースのタイトルをいくつか示します。 フォーマルの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。