CSS で 16 進数の RGBA カラーを使用できますか?

CSS で 16 進数の RGBa を使用できますか?

CSS で 16 進数の色を記述する従来の方法は、#RRGGBB 形式を使用することです。例:

background-color: #ff0000; /* red */

透明度を実現するには、アルファ チャネルを含む RGBA 形式を使用できます。

background-color: rgba(255, 0, 0, 0.5); /* translucent red */

ただし、現時点では部分的な透明度を指定する直接的な方法はありません。 16進数で。次の構文は使用できません:

background-color: #ff000088;

CSS カラー モジュール レベル 4 での今後のサポート

次期 CSS カラー モジュール レベル 4 では、4 桁および 8 桁の 16 進数 RGBA がサポートされる予定です。表記。構文は次のようになります。

8 桁:

#RRGGBBAA

4 桁:

#RGBA

今日の実用的な使用

この表記法に対するブラウザーのサポートはまだ制限されていますが、古いブラウザのフォールバックで使用できます:

figure {
  background: #FEFE7F;
  color: #3F3FFE;
  
  background: rgba(255, 255, 0, 0.5);
  color: rgba(0, 0, 255, 0.75);
  
  background: #ffff007F;
  color: #0000ffbe;
}

これにより、最新のブラウザでは透明な 16 進カラーが使用され、古いブラウザでは非透明カラーにフォールバックされます。

以上がCSS で 16 進数の RGBA カラーを使用できますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。