RGBについて.....
コンピューターでは光の3原色である赤(R)、緑(G)、青(B)
それぞれの色で0~255までの数値(256段階)で表すことで特定の色を表現します。
したがってフルカラーと呼ばれるものでは256*256*256=16777216色扱えるということになります。
補色について.....
色相関の反対に位置する関係の色。赤/緑。青/橙。黄/紫。余色、反対色とも云う。
色相関図の参考URL...
Little HEROES: https://garage.littleheroes.jp/colors/hue/circle/
HTMLで、色のスタイルシートの指定方法
個別に文字色を指定する方法について(#ハッシュ)を付けて16進数(HEX)のRGB値で指定します。
font color="#ff00ff"
(#ハッシュ)を付けて(HEX)16進数で指定します。
font color="#f0f"
3桁での省略も可能です。
表記例:<fontcolor="#ff00ff">あいうえお</font>
body{
background-color: white; // 背景色
color: rgb(255,128,128); // 文字色
color: rgb(100%,100%,0%); // yellow
color: #333;
color: # 996633;
}
配色の指定の方法の種類
- HEX(16進数)による指定(3文字での省略も可能)
表記例)color: #ff00ff;
表記例)color: #ff0;
- 色名による指定。基本16色以外では環境によって、きちんと表示できない場合があります。
表記例)color: green;
- 10進数による指定。0から255の値を指定。
表記例) rgb(255,255,255)
- パーセンテージによる指定。
表記例) rgb(100%,100%,100%)
- currentColor...当該、要素のcolorプロパティ。要素と同じ色が指定されます。
color:currentColor;
- transparent...透明を指定します。
color:transparent;
HTMLに直接記述するスタイルシートの指定方法
<span style="color: rgb(0,128,0);">緑</span>
<span style="color: red;">赤</span>
<span style="color: #fff;">白</span>
CSS3でのHSL色指定
※CSS3から指定可能になりました。hsl(色相環の度数[0-360],彩度[0-100%],輝度[0-100%])で指定できます。
Hue(色相)カラーサークルの色相環の角度で指定。赤(360)、緑(120)、青(240)
Saturation(彩度)色の鮮やかさ。0%(無彩色) ~ 100%(純色)の範囲指定。
Lightness/Luminarce(輝度)色の明るさ。0%(黒) ~ 100%(白)の範囲指定。
- ※表記例 (greenというクラスで指定の例です)
.green {background-color: hsl(120, 50%, 50%);}
rgba css3から指定可能
rgba(0,0,255,1)
のような形で指定。3つのrgbの指定をしたあと、alpha(透明度)を指定します。
rgbの指定は#00FF00のような16進数での表記はできません。透明度は0(完全に透明)から1(完全に不透明)の間で指定します。
同じくhslaというのもあります。次の形で指定。
hsla(0,50%,100%,0.5)