HTMLStyleElement - Web API 接口参考 编辑

HTMLStyleElement 接口表示 <style> 元素。它从 HTMLElement 和 LinkStyle 中继承属性和方法。

这个接口不允许修改包含其中的CSS（大多数情况下）。如果需要修改CSS，前往关于使用动态样式的信息查看在DOM中用于修改特定CSS属性的对象。

  <div id="interfaceDiagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveAspectRatio="xMinYMin meet"><a xlink:href="/wiki/zh-CN/docs/Web/API/EventTarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text  x="56" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">EventTarget</text></a><polyline points="111,25  121,20  121,30  111,25" stroke="#D4DDE4" fill="none"/><line x1="121" y1="25" x2="151" y2="25" stroke="#D4DDE4"/><a xlink:href="/wiki/zh-CN/docs/Web/API/Node" target="_top"><rect x="151" y="1" width="75" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text  x="188.5" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">Node</text></a><polyline points="226,25  236,20  236,30  226,25" stroke="#D4DDE4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#D4DDE4"/><a xlink:href="/wiki/zh-CN/docs/Web/API/Element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text  x="303.5" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">Element</text></a><polyline points="341,25  351,20  351,30  341,25" stroke="#D4DDE4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#D4DDE4"/><a xlink:href="https://developer.mozilla.org/wiki/zh-CN/docs/Web/API/HTMLElement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text  x="436" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">HTMLElement</text></a><polyline points="491,25  501,20  501,30  491,25" stroke="#D4DDE4" fill="none"/><line x1="501" y1="25" x2="509" y2="25" stroke="#D4DDE4"/><line x1="509" y1="25" x2="509" y2="90" stroke="#D4DDE4"/><line x1="509" y1="90" x2="492" y2="90" stroke="#D4DDE4"/><a xlink:href="/wiki/zh-CN/docs/Web/API/HTMLStyleElement" target="_top"><rect x="331" y="65" width="160" height="50" fill="#F4F7F8" stroke="#D4DDE4" stroke-width="2px" /><text  x="411" y="94" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">HTMLStyleElement</text></a></svg></div>

  a:hover text { fill: #0095DD; pointer-events: all;}

属性

Inherits properties from its parent, HTMLElement, and implements LinkStyle.

HTMLStyleElement.media

Is a DOMString representing the intended destination medium for style information.

HTMLStyleElement.type

Is a DOMString representing the type of style being applied by this statement.

HTMLStyleElement.disabled

Is a Boolean value representing whether or not the stylesheet is disabled (true) or not (false).

LinkStyle.sheet 只读

Returns the StyleSheet object associated with the given element, or null if there is none

HTMLStyleElement.scoped

Is a Boolean value indicating if the element applies to the whole document (false) or only to the parent's sub-tree (true).

方法

No specific method; inherits properties from its parent, HTMLElement, and LinkStyle.

规范

规范	状态	注释
HTML Living Standard HTMLStyleElement	Living Standard
HTML 5.1 HTMLStyleElement	Recommendation
HTML5 HTMLStyleElement	Recommendation	The following property has been added: scoped.
Document Object Model (DOM) Level 2 HTML Specification HTMLStyleElement	Obsolete	Added a second inheritence, the LinkStyle interface.
Document Object Model (DOM) Level 1 Specification HTMLStyleElement	Obsolete	Initial definition

浏览器兼容性

BCD tables only load in the browser

The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.

参见

• The HTML element implementing this interface: <style>.
• Using dynamic styling information to see how to manipulate CSS.