CSSで色を表現するにはいくつかの方法があります

CSS で色を表現するには、次の 6 つの方法があります: 1. 赤、青などの英単語、2. 「#FF0000」などの 16 進数値、3. 「RGB」などの RGB ( 255,0,0)"; 4. RGBA、たとえば "RGB(255,0,0,0.5)"; 5. HSL; 6. HSLA。

#このチュートリアルの動作環境: Windows 7 システム、css3 バージョン、Dell G3 コンピューター。

チュートリアルの推奨事項: css ビデオ チュートリアル

css での色のいくつかの表現

1. 色の定義、英語の単語の使用赤、青などの色を表す

2、16 進値

3 桁の 16 進数、#F00 など (各色は 1 つの 16 進数で表されます)

6 桁の 16 進数、例: #FF0000 (各色を 2 つの 16 進数で表します)

3. RGB 表現方法

RGB 三原色: RGB(255,0, 0) 指定された 3 つのパラメーターは、赤、緑、青の色の値を表し、0 ～ 225

RGB、RGB (100%、0%、0%) の 10 進数で表現されます。表現するパーセント記号

注: 上記の式はすべて RGB カラー システム (赤、緑、青)

4 に属します。RGBA: RGB と同じですが、透明度が追加されています。 RGB(255,0,0,0.5) など。 4 番目の値の範囲は 0 ～ 1 で、0 は完全に透明、1 は完全に不透明です。

5、HSL (後の色調整の学習によく使用されます): 色相、彩度、明るさ。たとえば、HSL(360,100%,50%)。

色相: 色の基本的な属性であり、赤などの一般的に呼ばれる色の名前です。

彩度: 色の純度を指します。色が高いほど純粋な色になり、徐々に低くなります。グレー、0 ～ 100% の値を取ります。

明るさ: 色の明るさです。色の明るさが高いほど、色が明るくなるほど、色の明るさが暗くなるほど、色が暗くなります。0 ～ 100% を取ります。

(ページでカラー システムを使用したい場合は、HSL を使用できます)

6. HSLA: HSL よりも透明度が高くなります。

使用法:

①color:blue;

最初の方法は、color 属性を呼び出し、コロンの後に色の英単語を入力することです。区切る 番号が終了します。

この方法は簡単ですが、表現できる色の種類は非常に限られています。

②color:#000000;

2 番目のタイプは「#」で始まり、各桁は 0、1、2、3、4、5、6、7、8 です。

9、a、b、c、d、e、f。最初の 1 と 2 桁は赤を表し、3 と 4 桁は緑を表し、5 と 6

は青を表します。 RGBの色表現の考え方と同様に、赤、緑、青の三原色を組み合わせてさまざまな色が生まれ、その種類は数多くあります。

③color:rgb(0,0,0);

3 番目の方法は RGB 表現です。値には 2 種類があります: 数値、すべての値は 0 ～ 255、パーセント値

、すべての値は 0% ～ 100% です。これらの共通の特徴は、最初の値が赤を表し、2 番目の

値が緑を表し、3 番目の値が青を表すことです。組み合わせにより様々な色を表現できます。

④color:rgba(0,0,0,0.5);

4 番目の方法は RGBA 表現です。 RGB 表現のアップグレード版であり、新しい透明属性が追加されています。

最初の 3 つの属性値は RGB 表記と同じです。4 番目の属性値の値の範囲は 0 ～ 1 で、

小数点以下 2 桁まで正確です。

⑤color:hsl (0, 100%, 100%);

5 番目の方法、HSL 表現。その意味: H は色相を表し、値の範囲は 0 ～

360 です。0 と 360 は赤を表し、120 は緑を表し、240 は青を表します。 S は彩度

を表し、値の範囲は 0% ～ 100% です。 L は明るさを表し、値の範囲は 0% ～ 100% です。

⑥color:hsla(0,100%,100%,0.5);

6 番目、HSLA 表現。これは HSL 表記の拡張バージョンで、値の範囲が 0 ～ 1 の透明度の属性

値が追加されています。

プログラミング関連の知識について詳しくは、

プログラミング教育

をご覧ください。 ！

以上がCSSで色を表現するにはいくつかの方法がありますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。