outline-offset

by 2 contributors:

概要

CSS の outline-offset プロパティは、要素の outline と、要素のボーダー境界の間隔を設定します。アウトラインとは、要素を囲むようにボーダー境界の外側に描かれる線で、要素を目立たせます。

  • 初期値 0
  • 適用対象 全要素
  • 継承 継承しない
  • メディア visual, interactive
  • 計算値 as specified, but with relative lengths converted into absolute lengths
  • アニメーションの可否 可。length の値として補完します。
  • 正規順序 形式文法で定義される一意のあいまいでない順序

このプロパティで設定された空間は、透明になるでしょう(親要素の背景が見えます)

構文

形式文法: <length>
outline-offset: 3px
outline-offset: 0.2em

outline-offset: inherit

<length>
空間の幅です。使用可能な単位については <length> をご覧ください。負の値は要素の内側にアウトラインを置きます。

.example {
  outline: dashed thin;
  /* Move the outline 3px away from the border */
  outline-offset: 3px;
}

上のコードは次のような効果を作ります:

outline: offset 5px;

別の例:

outline: multiple offsets;

仕様

仕様書 策定状況 コメント
CSS Basic User Interface Module Level 3 草案 初回定義
CSS Transitions 草案 outline-offset をアニメーション可能として定義

ブラウザ実装状況

機能 Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
基本サポート 1.0 1.5 (1.8) 未サポート 9.5 1.2 (125)
機能 Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
基本サポート ? ? ? ? ?

関連情報

ドキュメントのタグと貢献者

Contributors to this page: ethertank, sosleepy
最終更新者: ethertank,
サイドバーを隠す