border ボーダーのスタイル・太さ・色を四方まとめて指定する

border:solid double dashed dotted 1px 2px 3px 4px #f00 #0f0 #00f #f0f;

のように四方をそれぞれ指定することはできません。
IE以外のブラウザでは、全てが無視されます。
IEでは種類別の最後の指定のみ有効となります。
(この場合border:dotted 4px #f0f;となります。)

対応ブラウザ

  • IE4
  • IE5
  • IE6
  • IE7
  • IEMac
  • Netscape6
  • Netscape7
  • Firefox1
  • Firefox2
  • Firefox3
  • Opera6
  • Opera7
  • Opera8
  • Opera9
  • Safari1
  • Safari2
  • Safari3

仕様

なし

内容
スタイル
noneボーダーは表示されず、太さも0です
表のセルなどボーダーが重なり合う場合は他のボーダー指定が優先となる
[初期値]
hiddenボーダーは表示されず、太さも0です
表のセルなどボーダーが重なり合う場合はこの値が優先となる
solid1本線で表示する
double2本線で表示する
groove立体的に窪んだ線で表示する
ridge立体的に隆起した線で表示する
inset上と左が暗く、下と右が明るいボーダーが表示され、囲まれた領域が立体的に窪んだように表示される
outset上と左が明るく、下と右が暗いボーダーが表示され、囲まれた領域全体が立体的に隆起したように表示される
dashed破線で表示する
dotted点線で表示する
太さ
数値数値にpxなどの単位をつけて指定する
キーワードで指定thin(細い)、medium(普通)、thick(太い)のいずれか
実際に表示される太さはブラウザにより異なる
色コード#000000、#000、blackなど色を指定する
transparentボーダーの色を透明にする

スポンサーリンク

関連記事

スポンサーリンク

オスが先に卵を温める理由

ホームページ製作・web系アプリ系の製作案件募集中です。

上に戻る