CSS outline-style 屬性

定義和用法

outline-style 屬性用于設置元素的整個輪廓的樣式。樣式不能是 none,否則輪廓不會出現。

outline (輪廓)是繪制于元素周圍的一條線,位于邊框邊緣的外圍,可起到突出元素的作用。outline 屬性設置元素周圍的輪廓線。

注釋:請始終在 outline-color 屬性之前聲明 outline-style 屬性。元素只有獲得輪廓以后才能改變其輪廓的顏色。

注釋:輪廓線不會占據空間,也不一定是矩形。

另請參閱:

CSS 教程:CSS 輪廓

CSS 參考手冊:outline 屬性

HTML DOM 參考手冊:outlineStyle 屬性

實例

設置輪廓的樣式:

p
  {
  outline-style:dotted;
  }

親自試一試

CSS 語法

outline-style: none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset|initial|inherit;

屬性值

描述
none 默認。定義無輪廓。
hidden 定義隱藏的輪廓。
dotted 定義點狀輪廓。
dashed 定義虛線輪廓。
solid 定義實線輪廓。
double 定義雙線輪廓。雙線的寬度等同于 outline-width 的值。
groove 定義 3D 凹槽輪廓。此效果取決于 outline-color 值。
ridge 定義 3D 凸槽輪廓。此效果取決于 outline-color 值。
inset 定義 3D 凹邊輪廓。此效果取決于 outline-color 值。
outset 定義 3D 凸邊輪廓。此效果取決于 outline-color 值。
inherit 規定應該從父元素繼承輪廓樣式的設置。

技術細節

默認值: none
繼承性: no
版本: CSS2
JavaScript 語法: object.style.outlineStyle="dotted"

TIY 實例

設置輪廓的樣式
本例演示如何設置輪廓的樣式。

瀏覽器支持

表格中的數字注明了完全支持該屬性的首個瀏覽器版本。

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

注釋:如果規定了 !DOCTYPE,則 IE8 支持 outline 屬性。