例
紅色添加到<h1>元素：
document.getElementById("myH1").style.color = "red"; 在設置樣式：
Hello World!
設置樣式後：
Hello World!
試一試» 更多"Try it Yourself"下面的例子。
定義和用法
樣式屬性返回的CSSStyleDeclaration對象，它代表一個元素的樣式屬性。
樣式屬性用於獲取或設置使用不同的CSS屬性的元素的特定風格。
注意：這是不可能通過的樣式屬性，例如， 元素 .style =指定的字符串設置樣式"color: red;" 。 要設置元素的樣式，一個追加"CSS"屬性的風格和指定值，如下所示：
element .style.backgroundColor = "red"; // set the background color of an element to red Try it
正如你所看到的，用於設置CSS屬性的JavaScript語法是略有不同的CSS (backgroundColor instead of background-color) 。
對於所有可用屬性的列表，請參閱我們的Style對象參考 。
注意：樣式屬性只返回元素的內嵌樣式屬性，例如設置CSS聲明
<P風格=“顏色：紅;”>。 這是不可能使用此屬性來從有關樣式規則信息<head>的文檔或外部樣式表中的一節。
但是，您可以訪問<style>從元素<head>使用文檔。 getElementsByTagName()
var x = document.getElementsByTagName("STYLE")[0]; // get the first
<style> element Try it
注：建議使用的樣式屬性，而不是element 。 setAttribute("style", "...")的方法，因為樣式屬性不會覆蓋可以在指定的其他CSS屬性style屬性。
瀏覽器支持
| 屬性 | |||||
|---|---|---|---|---|---|
| style | 是 | 是 | 是 | 是 | 是 |
句法
返回樣式屬性：
element .style. property 設置樣式屬性：
element .style. property = value 屬性值
| 值 | 描述 |
|---|---|
| value | 規定指定屬性的值。 例如，對於borderBottom屬性： 元件 .style.borderBottom =“2px的固體紅”; |
技術細節
| 返回值： | 的CSSStyleDeclaration對象，表示元素的樣式屬性 |
|---|---|
| DOM版本 | DOM級別2 CSS |
更多示例
相關頁面
CSS教程： CSS教程
CSS參考： CSS屬性
HTML DOM參考： Style對象參考
HTML參考： HTML <style>標籤
<元素對象