CSS outline-width 属性

定義と使用法

outline-width属性は要素全体の轮廓の幅を設定します。轮廓のスタイルがnoneでない場合にのみ、この幅が有効です。スタイルがnoneの場合、幅は実際には0にリセットされます。負の長さ値の設定は許可されていません。

outline(轮廓)は要素の周りに描かれる線で、境界線の外側に位置し、要素を強調する役割を果たします。outline属性は要素の周りの轮廓線を設定します。

注記:常にoutline-style属性を宣言した後にoutline-width属性を宣言してください。要素が轮廓を取得するまで、轮廓の色を変更することはできません。

注記:轮廓線はスペースを占めず、必ずしも矩形ではありません。

参照もしてください:

CSS チュートリアル:CSS 轮廓

CSS リファレンスマニュアル:outline 属性

HTML DOM リファレンスマニュアル:outlineWidth 属性

点線の轮廓の色を設定:

p
  {
  outline-style:dotted;
  outline-width:5px;
  }

自分で試してみる

CSS 文法

outline-width: medium|thin|thick|length|initial|inherit;

属性値

説明
thin 細い轮廓を指定します。
medium デフォルト。中間の轮廓を指定します。
thick 太い轮廓を指定します。
length 轮廓の太さの値を指定することができます。
inherit 親要素から轮廓の幅の設定を継承するべきであることを指定します。

技術的詳細

デフォルト値: medium
継承性: no
バージョン: CSS2
JavaScript 文法: object.style.outlineWidth="thin"

TIY 実例

轮廓の幅を設定
この例では、轮廓の幅を設定する方法を示します。

ブラウザのサポート

テーブルの数字は、その属性を完全にサポートする最初のブラウザのバージョンを示しています。

Chrome IE / Edge Firefox Safari Opera
1.0 8.0 1.5 1.2 7.0

注記:DOCTYPEが指定されている場合、IE8はoutline属性をサポートします。