Go to information

outline-style

outline-styleプロパティは輪郭線（アウトライン）の種類（スタイル）を指定します。

値
初期値
none
適用対象
すべての要素
継承
しない
メディア

outline-styleプロパティに指定できる値のキーワードは、それぞれ以下の意味を示します。

none
輪郭線なし（輪郭線の幅の値は強制的に0になる）
dotted
輪郭線は点線（丸い点線）になる
dashed
輪郭線は破線（四角い点線）になる
solid
輪郭線は実線になる
double
輪郭線は二重の実線になる
groove
輪郭線を窪んでいる様に見せる
ridge
輪郭線を隆起している様に見せる
inset
輪郭線の内側全体が窪んでいる様に見せる
outset
輪郭線の内側全体が隆起している様に見せる

原則、border-styleプロパティと同じですが、"hidden" が除かれます。輪郭線についての詳細は、outlineプロパティを参照ください。

outline-styleプロパティの実装状況

Windows版Internet Explorer
×
Firefox
○
Opera
○
Safari
×
Macintosh版Internet Explorer 5
○

サンプル

記述例
input:focus   { outline : orange thick ; }
.dotted:focus { outline-style : dotted ; }
.dashed:focus { outline-style : dashed ; }
.solid:focus  { outline-style : solid  ; }
.double:focus { outline-style : dotted ; }
.groove:focus { outline-style : dashed ; }
.ridge:focus  { outline-style : solid  ; }
.inset:focus  { outline-style : dotted ; }
.outset:focus { outline-style : dashed ; }
表示例
現在位置
  1. W3G
  2. CSS
  3. ユーザインタフェイス
  4. outline-style
ナビゲーション
ステータス情報
作者
上田 遼
公開
2007-02-02T16:41:30+09:00
更新
2008-12-29T04:30:38+09:00
URI
http://w3g.jp/css/user_interface/outline-style
検索

直近の制作実績等：大阪人間科学大学 New! / 大阪薫英女子短期大学 New! / セキスイハイム みんなのお国じまん New!