WEB

【CSS】rgb()関数の書き方にアップデート

はじめに

WEBデザインギャラリーのかっこいいサイトのソースを覗いてみると、color: rgb(222 199 168 / .8);という書き方を見つけました。調べてみると、rgb記法で透明度も指定できることが分かりました。この新しい記法により、従来のrgbaの書き方はレガシー構文、すなわち古いものとされています。

記述方法

レガシー記法では、このように記述していたものをrgb記法にアップデートできます。

color:rgba(222,199,168,1);

 

rgb記法

color: rgb(222 199 168 / .8);
color: rgb(222 199 168 / 80%);

新しい記法では、カンマ(,)を使用せずに、半角スペースで区切り、必要に応じて透明度(アルファ値)はスラッシュ(/)で指定します。

参考サイト

こちらのサイトを参考にさせていただきました。

 

 

N.T
平日はコーディング、週末は子供と公園を走り回っています。