CSS では不透明度を背景色のみに設定し、テキストの不透明度は設定しません

CSS では、CSS の「background」プロパティを使用して、特定の HTML 要素の背景を設定できます。場合によっては、HTML 要素のコンテンツに影響を与えずに背景色の不透明度を下げる必要がある場合があります。

「背景色」プロパティに色の値を割り当てるときに、アルファ変数の値を減らすことで、背景色の不透明度を下げることができます。

＃＃＃文法＃＃＃

ユーザーは次の構文に従って、CSS のテキストではなく背景色のみに不透明度を設定できます。

リーリー

ユーザーは「rgba」または「hsla」を使用して背景色を設定できます。ここで「a」はアルファの不透明度を表し、その値は 0 ～ 1 です。

例 1

以下の例では、HTML div 要素を作成し、「background」属性を使用して背景色を設定します。 「rgba」値を使用して背景色を設定します。 「赤」色を不透明度「0.1」の背景に設定し、ユーザーが出力で確認できるようにします。

リーリー

例 2

以下の例では、「background-color」CSS プロパティを使用して HTML div 要素の背景を設定します。さらに、背景には「hsla」値を使用し、アルファ不透明度には「0.2」を使用します。

ユーザーは不透明度の値を 0 と 1 の間で増減して、背景色の変化を観察できます。

リーリー

例 3

背景 div をコンテンツ div から分離し、div 要素の不透明度の低い背景色を設定できます。

ここには親 div があります。親 div には、背景 div とコンテンツ div があります。背景 div とコンテンツ div は親 div と同じサイズになります。両方の div 要素の z-index 属性を設定して、背景 div の上にコンテンツ div を表示できます。

その後、CSS の「不透明度」プロパティを使用して、背景 div のみの不透明度を下げることができます。このようにして、背景 div をコンテンツ div の下に配置し、背景 div の不透明度を調整できます。

リーリー

ユーザーは、テキストや div コンテンツの不透明度に影響を与えることなく、背景色の不透明度を設定する方法を学びました。ユーザーは、「rgba」または「hsla」値を使用するときに色の不透明度を下げることができます。ユーザーが背景として画像やその他のものを持っている場合、背景とコンテンツに個別の div を作成し、背景 div の不透明度を下げることができます。

以上がCSS では不透明度を背景色のみに設定し、テキストの不透明度は設定しませんの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。