Style outlineStyle 屬性

定義和用法

outlineStyle 屬性設置或返回元素周圍輪廓的樣式。

輪廓是圍繞元素的一條線。它顯示在元素的外邊距周圍。但是，它與邊框屬性不同。

輪廓不是元素尺寸的一部分，因此元素的寬度和高度屬性不包含輪廓的寬度。

另請參閱：

CSS 教程：CSS 輪廓

CSS 參考手冊：outline-style 屬性

HTML DOM 參考手冊：outline 屬性

實例

例子 1

在 <div> 元素周圍添加實心輪廓：

document.getElementById("myDiv").style.outlineStyle = "solid";

親自試一試

例子 2

更改 <div> 元素的輪廓樣式：

document.getElementById("myDiv").style.outlineStyle = "solid";

親自試一試

例子 3

返回 <div> 元素的輪廓樣式：

alert(document.getElementById("myDiv").style.outlineStyle);

親自試一試

例子 4

對所有不同值的演示：

var listValue = selectTag.options[selectTag.selectedIndex].text;
document.getElementById("myDiv").style.outlineStyle = listValue;

親自試一試

語法

返回 outlineStyle 屬性：

object.style.outlineStyle

設置 outlineStyle 屬性：

object.style.outlineStyle = value

屬性值

值 描述
none 默認。定義無輪廓。
hidden 輪廓被關閉。
dotted 定義點狀輪廓。
dashed 定義虛線輪廓。
solid 定義實線輪廓。
double 定義雙線輪廓。雙線的寬度等同于 outline-width 的值。
groove 定義 3D 凹槽輪廓。定義 3D 凹槽輪廓。此效果取決于 outline-color 值。
ridge 定義 3D 凸槽輪廓。此效果取決于 outline-color 值。
inset 定義 3D 凹邊輪廓。此效果取決于 outline-color 值。
outset 定義 3D 凸邊輪廓。此效果取決于 outline-color 值。
initial 將此屬性設置為其默認值。請參閱 initial。
inherit 從其父元素繼承此屬性。請參閱 inherit。

技術細節

默認值： none
返回值： 字符串，表示元素輪廓的樣式。
CSS 版本： CSS2

瀏覽器支持

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
支持 支持 支持 支持 支持