CSSで文字の色を変更するCSSファイルの準備と文法について理解が出来たら、実際にコードを記述してみましょう。文字(テキスト)の色を変更してみましょう。ブックマークHTML・CSSWebデザイン公開日:2019/06/19最終更新日:2019/06/20目次1.カラーネームで色を指定する2.16進数カラーコードで色を指定する3.RGB・RGBAカラーモデルで色を指定する1.カラーネームで色を指定するCSSを使って実際に装飾をおこなってみましょう。index.htmlと「CSSの記述場所と文法について」で作成したstyle.cssに記述をしていきます。HTMLにクラス名を記述して、そのクラスに対してCSSを適用していきます。文字の色を変更してみましょう。文字の色を変更するCSSは「color」です。値にはカラーネーム、16進数による表記、RGBもしくはRGBAカラーモデルが入れられます。今回は値として「red」をいれます。「red」はその名前の通り「赤」を表現するカラーネームです。class="text">赤い文字が表示されます。}プレビュー:文字の色は赤くなりましたでしょうか?カラーネームは他にもblue、greenやblack、whiteなどがあります。カラーネームだけではWebで使える全ての色は表現できません。そこでよく使われるのが16進数を使ったカラーコードです。2.16進数カラーコードで色を指定する普段、わたしたちが生活で使っている数字は10までいくと位(くらい)が上がります。16進数とは、10になっても位が上がらず、16になると位が上がるという記数法です。11〜16を表すことができなくなってしまうので、それをアルファベットのA〜Fで表します。パソコンやスマートフォンのモニターではR(赤)・G(緑)・B(青)の3色を混ぜ合わせることによって色を表現しています(光の三原色)。それぞれの色が強ければ強いほど白に近づき、弱ければ弱いほど黒に近づきます。この3色の強さを16進数で表したのが、カラーコードです。`#FFFFFF`と記述すると、色は白になります。}`#000000`と記述すると、色は黒になります。}このコードは赤・緑・青の3つの色を指定しています。赤を一番強くして、緑と青を一番弱くします。}緑と青も試してみましょう。}黄色になりました(見えづらいので背景を黒くしました)。このように3色を掛け合わせることで1677万通りの色をつくることができます。これらの色を全て覚えておくのは無理ですので、Photoshopなどのデザインツールにはカラーコードを表示してくれる機能があります。見本」のように調べると、代表的なカラーコードの一覧を様々なサイトで紹介しているのが見つかるはずです。3.RGB・RGBAカラーモデルで色を指定する先ほどのカラーコードは16進数で色の段階を表現していましたが、00〜FFまでを10進数で表すと0〜256と表現することができます。実はCSSではrgb関数というものを使えば、10進数でも色の表現をすることができます。赤は以下のコードになります。`(カンマ)で区切って表現します。RGBにAlpha(透過)が加わったのがrgba関数です。色を半透明に出来ます。これは0〜1の間で表現します。赤の透明度を50%にしてみます。}文字の色だと少しわかりづらいですが、例えば半透明の矩形が重なると以下のような感じで透明部分が混ざり合います。文字の色の変更はできましたでしょうか?続いて次のレッスンでは太字・斜体・下線などを紹介します。