2020/12/27

CSSで文字色と背景色を変える方法【現役エンジニアが解説】

PROGRAM

今回は、CSSで文字色と背景色を変える方法について、それぞれに分け、簡単に解説していきます。

文字色を変える

文字色を変えるには、colorプロパティを使います。

colorプロパティの値にはHTMLカラーコードもしくは色名を指定します。

body{
    color:red;
}

上記のコードでは、CSSでbody要素内の全ての文字の色を赤色に変更しています。

背景色を変える

背景色を変えるためには、background-colorプロパティを使用します。

background-colorプロパティの値もHTMLカラーコードもしくは色名にします。

body{
    background-color:green;
}

上記のコードでは、CSSでbody要素(基本的には全体)の背景の色を緑色に変更しています。

枠線色を変える

枠線色はborderプロパティまたはborder-colorプロパティで変えられます。

borderプロパティやborder-colorプロパティの値にもコードもしくは色名を設定します。

table{
    border:1px blue solid;
    /* border-color:blue; */
}

上記のコードでは、CSSでtable要素の枠線の色を青色に変更しています。コメントアウトのborder-colorプロパティを使う場合でも同様です。

• facebook
• Tweet
• Read Later