4 out of 7 rated this helpful - Rate this topic

styleSheet object

[This documentation is preliminary and is subject to change.]

Represents a single style sheet in the document.

Standards information

There are no standards that apply here.

Remarks

You can use this object to retrieve style sheet information, such as the URL of the source file for the style sheet and the element in the document that owns (defines) the style sheet. You can also use it to modify style sheets.

You can retrieve a styleSheet object from the styleSheets collection or from the imports collection. Each item in these collections is a style sheet. A styleSheet object is available for a style sheet only if it is included in a document with a style or link element, or with an @import statement in a style element.

Examples

This example uses the styleSheet object to change the cascading style sheets (CSS) values of inline and imported styles.


<STYLE>
BODY {background-color: #CFCFCF;}
@import url("otherStyleSheet.css");
</STYLE>
<SCRIPT>
window.onload=fnInit;
function fnInit(){
   // Access a rule in the styleSheet, change backgroundColor to blue.
   var oStyleSheet=document.styleSheets[0];
   var oRule=oStyleSheet.rules[0];
   oRule.style.backgroundColor="#0000FF";
   // Add a rule for P elements to have yellow backgrounds.
   oStyleSheet.addRule("P","background-color: #FFFF00;");
   // Change and imported rule:
   oStyleSheet.imports[0].color="#000000";
}
</SCRIPT>

 

 

Build date: 3/14/2012

Did you find this helpful?
(1500 characters remaining)
Community Content Add
Annotations FAQ