CSSで色々指定する方法

文字色

color: #000000;

#を除いた6桁の数値はRGB値(2桁区切り、0~fまでの16進数表記)を表す。

以下、色の例。

  • 黒:#000000。
  • 白:#ffffff。
  • 赤:#ff0000。
  • 緑:#00ff00。
  • 青:#0000ff。

背景色

background-color: #000000;

値の指定は文字色と同じ。

border: 1px solid #000000;

値は線の太さ、線の種類、線の色の順。

これは上下左右の全てを一括で指定するもの。

それぞれ指定する時は次の項目を使う。

  • 上:border-top。
  • 下:border-bottom。
  • 左:border-left。
  • 右:border-right。

外側の余白

margin: 0px 0px 16px 16px;

値は複数の書き方があり、それによって余白を作れる箇所が変わる。

書き方は次の通り。

  • 値1個:上下左右。
  • 値2個:上下、左右。
  • 値3個:上、左右、下。
  • 値4個:上、右、下、左。

なお、複数の値を書く時はスペースで区切って書く。

基本的には4個指定で書いて、順番は上を基準に時計回りと覚える。

内側の余白

padding: 0px 0px 16px 16px;

値の指定は外側の余白と同じ。

inserted by FC2 system