CSS outline-style 屬性
- 上一頁 outline-offset
- 下一頁 outline-width
定義和用法
outline-style 屬性用于設置元素的整個輪廓的樣式。樣式不能是 none,否則輪廓不會出現。
outline (輪廓)是繪制于元素周圍的一條線,位于邊框邊緣的外圍,可起到突出元素的作用。outline 屬性設置元素周圍的輪廓線。
注釋:請始終在 outline-color 屬性之前聲明 outline-style 屬性。元素只有獲得輪廓以后才能改變其輪廓的顏色。
注釋:輪廓線不會占據空間,也不一定是矩形。
另請參閱:
CSS 教程:CSS 輪廓
CSS 參考手冊:outline 屬性
HTML DOM 參考手冊:outlineStyle 屬性
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 屬性。
- 上一頁 outline-offset
- 下一頁 outline-width