HTML DOM Element style 屬性

定義和用法

style 屬性返回元素的 style 屬性的值，以 CSSStyleDeclaration 對象。

CSSStyleDeclaration 對象包含元素的所有行內樣式屬性。它不包含在 <head> 部分或任何外部樣式表中設置的任何樣式屬性。

要點 1

您不能設置這樣的樣式：

element.style = "color:red";

您必須使用這樣的 CSS 屬性：

element.style.backgroundColor = "red";

親自試一試

要點 2

JavaScript 語法與 CSS 語法略有不同：

backgroundColor / background-color

請參閱我們的 完整 Style 對象參考手冊。

要點 3

請用這個 style 屬性，而不是 setAttribute() 方法，以防止覆蓋 style 屬性中的其他屬性。

另請參閱：

CSS 教程

CSS 參考手冊

Style 對象

HTML <style> 標簽

實例

例子 1

更改 "myH1" 的顏色：

document.getElementById("myH1").style.color = "red";

親自試一試

例子 2

獲取 "myP" 的上邊框的值：

let value = document.getElementById("myP").style.borderTop;

親自試一試

語法

返回 style 屬性：

element.style.property

設置 style 屬性：

element.style.property = value

屬性值

值 描述
value

指定屬性的值。

例如：

element.style.borderBottom = "2px solid red"

返回值

類型 描述
對象 元素的 CSSStyleDeclaration 對象。

瀏覽器支持

element.style 是 DOM Level 2 (2001) 特性。

所有瀏覽器都完全支持它：

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
支持 9-11 支持 支持 支持 支持