スタイルoutlineStyleプロパティ
例
<div>要素の周りに「実線」のアウトラインを追加します。
document.getElementById("myDiv").style.outlineStyle = "solid";
定義と使用法
outlineStyleプロパティは、要素の周囲のアウトラインのスタイルを設定または返します。
アウトラインは、要素の周りの線です。要素の余白の周りに表示されます。ただし、borderプロパティとは異なります。
アウトラインは要素の寸法の一部ではないため、要素の幅と高さのプロパティにはアウトラインの幅が含まれていません。
ブラウザのサポート
Property | |||||
---|---|---|---|---|---|
outlineStyle | Yes | Yes | Yes | Yes | Yes |
構文
outlineStyleプロパティを返します。
object.style.outlineStyle
outlineStyleプロパティを設定します。
object.style.outlineStyle = value
プロパティ値
Value | Description |
---|---|
none | Defines no outline. This is default |
hidden | The outline is turned off |
dotted | Defines a dotted outline |
dashed | Defines a dashed outline |
solid | Defines a solid outline |
double | Defines a double outline |
groove | Defines a 3D grooved outline. The effect depends on the outline-color value |
ridge | Defines a 3D ridged outline. The effect depends on the outline-color value |
inset | Defines a 3D inset outline. The effect depends on the outline-color value |
outset | Defines a 3D outset outline. The effect depends on the outline-color value |
initial | Sets this property to its default value. Read about initial |
inherit | Inherits this property from its parent element. Read about inherit |
技術的な詳細
デフォルト値: | なし |
---|---|
戻り値: | 要素のアウトラインのスタイルを表す文字列 |
CSSバージョン | CSS2 |
その他の例
例
<div>要素のアウトラインスタイルを変更します。
document.getElementById("myDiv").style.outlineStyle = "solid";
例
<div>要素のアウトラインスタイルを返します。
alert(document.getElementById("myDiv").style.outlineStyle);
例
すべての異なる値のデモンストレーション:
var listValue = selectTag.options[selectTag.selectedIndex].text;
document.getElementById("myDiv").style.outlineStyle = listValue;
関連ページ
CSSチュートリアル:CSSの概要
CSSリファレンス:outline-styleプロパティ
HTML DOMリファレンス:アウトラインプロパティ
❮スタイルオブジェクト