CSS - border-width

トップ > CSSリファレンス > border-width

概要

属性名 border-width
[ <length> | thin | mediun | thick ]{1,4}
初期値medium
適用可能要素すべて
継承継承しない
メディアvisual
アニメーション可能

サポート (説明)

CSSIE/EdgeFirefoxChromeOperaSafari
CSS14113.51

説明

ボーダーラインの太さを指定します。

説明
<length>線の太さを指定します。詳細は <length> を参照してください。
thin細い線にします。
medium中程度の線にします。
thick太い線にします。

値を 4つ指定した場合、それぞれは、上、右、下、左に適用されます。左を省略すると右と同じ値になります。下を省略すると上の同じ値になります。右を省略すると上と同じ値になります。

border-width: 1px;              /* 上:1px、右:1px、下:1px、左:1px */
border-width: 1px 2px;	        /* 上:1px、右:2px、下:1px、左:2px */
border-width: 1px 2px 3px;      /* 上:1px、右:2px、下:3px、左:2px */
border-width: 1px 2px 3px 4px;	/* 上:1px、右:2px、下:3px、左:4px */

使用例

CSS
.sample {
    border-width: 3px;
    border-color: red;
    border-style: solid;
    height: 32px;
    width: 120px;
    margin: 1em;
}
HTML
<div class="sample"></div>
表示

関連項目

border, border-width, border-style, border-color

リンク


Copyright (C) 1997-2016 杜甫々
初版:1997年7月27日、最終更新:2016年1月3日
http://www.tohoho-web.com/css/prop/border-width.htm