CSS outline-offset 属性

定義と使用方法

outline-offset属性は輪郭にオフセットを適用し、枠線のエッジに描画します。

輪郭は枠線と二つの面で異なります：

  • 輪郭は空間を占めません
  • 輪郭は非矩形で可能です

も参照してください：

CSSチュートリアル：CSS ユーザーインターフェース

HTML DOMリファレンスマニュアル：outlineOffset属性

例

枠線の外側15ピクセルの輪郭を指定します：

div
{
border:2px solid black;
outline:2px solid red;
outline-offset:15px;
}

実際に試してみてください

CSS文法

outline-offset: length|inherit;

属性値

値 説明
length 輪郭と枠線のエッジの距離。
inherit outline-offset属性の値は親要素から継承されるべきです。

技術的詳細

デフォルト値： 0
継承性： no
バージョン： CSS3
JavaScript文法： object.style.outlineOffset="15px"

ブラウザのサポート

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

Chrome IE / Edge Firefox Safari Opera
4.0 15.0 3.5 3.1 10.5