以下に、提供された記事に基づいた質問ベースのタイトルをいくつか示します。 フォーマル

子要素の継承された不透明度をオーバーライドする

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>

追加の注意事項:

• 子要素が不透明度の値が 1 未満です。
• RGBA カラーを使用すると、子要素の色にのみ影響するため、不透明度の効果が完全には再現されません。

以上が以下に、提供された記事に基づいた質問ベースのタイトルをいくつか示します。 フォーマルの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。