5. Document Object Model CSS

Editors: Vidur Apparao, Netscape Communications Corp.; Philippe Le Hégaret, W3C; Chris Wilson, Microsoft

5.1. Overview of the DOM Level 2 CSS Interfaces

The DOM Level 2 Cascading Style Sheets (CSS) interfaces are designed with the goal of exposing CSS constructs to object model consumers. Cascading Style Sheets is a declarative syntax for defining presentation rules, properties and ancillary constructs used to format and render Web documents. This document specifies a mechanism to programmatically access and modify the rich style and presentation control provided by CSS (specifically CSS level two [CSS2]). This augments CSS by providing a mechanism to dynamically control the inclusion and exclusion of individual style sheets, as well as manipulate CSS rules and properties.

The CSS interfaces are organized in a logical, rather than physical structure. A collection of all style sheets referenced by or embedded in the document is accessible on the document interface. Each item in this collection exposes the properties common to all style sheets referenced or embedded in HTML and XML documents; this interface is described in the Style Sheets chapter of the DOM Level 2. User style sheets are not accessible through this collection, in part due to potential privacy concerns (and certainly read-write issues).

For each CSS style sheet, an additional interface is exposed - the CSSStyleSheet interface. This interface allows access to the collection of rules within a CSS style sheet and methods to modify that collection. Interfaces are provided for each specific type of rule in CSS2 (e.g. style declarations, @import rules, or @font-face rules), as well as a shared generic CSSRule interface.

The most common type of rule is a style declaration. The CSSStyleRule interface that represents this type of rule provides string access to the CSS selector of the rule, and access to the property declarations through the CSSStyleDeclaration interface.

Finally, an optional CSS2Properties interface is described; this interface (if implemented) provides shortcuts to the string values of all the properties in CSS level 2.

All CSS objects in the DOM are "live", that is, a change in the style sheet is reflected in the computed and actual style.

A DOM application can use the hasFeature method of the DOMImplementation interface to determine whether the CSS interfaces are supported or not. The feature string for the CSS Model is "CSS". The existence within an implementation of the extended interfaces can also be queried using the hasFeature method.

5.2. CSS Fundamental Interfaces

The interfaces within this section are considered fundamental, and must be supported by all conforming DOM implementations. These interfaces represent CSS style sheets specifically.

Interface CSSStyleSheet (introduced in DOM Level 2)

The CSSStyleSheet interface is a concrete interface used to represent a CSS style sheet i.e. a style sheet whose content type is "text/css".

IDL Definition

// Introduced in DOM Level 2:
interface CSSStyleSheet : stylesheets::StyleSheet {
  readonly attribute CSSRule          ownerRule;
  readonly attribute CSSRuleList      cssRules;
  unsigned long      insertRule(in DOMString rule, 
                                in unsigned long index)
                                        raises(DOMException);
  void               deleteRule(in unsigned long index)
                                        raises(DOMException);
};

Attributes

ownerRule of type CSSRule, readonly: If this style sheet comes from an @import rule, the ownerRule attribute will contain the CSSImportRule. In that case, the ownerNode attribute in the StyleSheet interface will be null. If the style sheet comes from an element or a processing instruction, the ownerRule attribute will be null and the ownerNode attribute will contain the Node.
cssRules of type CSSRuleList, readonly: The list of all CSS rules contained within the style sheet. This includes both rule sets and at-rules.

Methods

insertRule

Used to insert a new rule into the style sheet. The new rule now becomes part of the cascade.

Parameters

`DOMString`		`rule`		The parsable text representing the rule. For rule sets this contains both the selector and the style declaration. For at-rules, this specifies both the at-identifier and the rule content.
`unsigned long`		`index`		The index within the style sheet's rule list of the rule before which to insert the specified rule. If the specified index is equal to the length of the style sheet's rule collection, the rule will be added to the end of the style sheet.

Return Value

unsigned long

The index within the style sheet's rule collection of the newly inserted rule.

Exceptions

DOMException

HIERARCHY_REQUEST_ERR: Raised if the rule cannot be inserted at the specified index e.g. if an @import rule is inserted after a standard rule set or other at-rule.

INDEX_SIZE_ERR: Raised if the specified index is not a valid insertion point.

NO_MODIFICATION_ALLOWED_ERR: Raised if this style sheet is readonly.

SYNTAX_ERR: Raised if the specified rule has a syntax error and is unparsable.

deleteRule

Used to delete a rule from the style sheet.

Parameters

unsigned long

index

The index within the style sheet's rule list of the rule to remove.

Exceptions

DOMException

INDEX_SIZE_ERR: Raised if the specified index does not correspond to a rule in the style sheet's rule list.

NO_MODIFICATION_ALLOWED_ERR: Raised if this style sheet is readonly.

No Return Value

Interface CSSRuleList (introduced in DOM Level 2)

The CSSRuleList interface provides the abstraction of an ordered collection of CSS rules.

IDL Definition

// Introduced in DOM Level 2:
interface CSSRuleList {
  readonly attribute unsigned long    length;
  CSSRule            item(in unsigned long index);
};

Attributes

length of type unsigned long, readonly: The number of CSSRules in the list. The range of valid child rule indices is 0 to length-1 inclusive.

Methods

item

Used to retrieve a CSS rule by ordinal index. The order in this collection represents the order of the rules in the CSS style sheet.

Parameters

unsigned long

index

Index into the collection

Return Value

CSSRule

The style rule at the index position in the CSSRuleList, or null if that is not a valid index.

No Exceptions

Interface CSSRule (introduced in DOM Level 2)

The CSSRule interface is the abstract base interface for any type of CSS statement. This includes both rule sets and at-rules. An implementation is expected to preserve all rules specified in a CSS style sheet, even if the rule is not recognized by the parser. Unrecognized rules are represented using the CSSUnknownRule interface.

IDL Definition

// Introduced in DOM Level 2:
interface CSSRule {
  // RuleType
  const unsigned short      UNKNOWN_RULE                   = 0;
  const unsigned short      STYLE_RULE                     = 1;
  const unsigned short      CHARSET_RULE                   = 2;
  const unsigned short      IMPORT_RULE                    = 3;
  const unsigned short      MEDIA_RULE                     = 4;
  const unsigned short      FONT_FACE_RULE                 = 5;
  const unsigned short      PAGE_RULE                      = 6;

  readonly attribute unsigned short   type;
           attribute DOMString        cssText;
                                        // raises(DOMException) on setting

  readonly attribute CSSStyleSheet    parentStyleSheet;
  readonly attribute CSSRule          parentRule;
};

Definition group RuleType

An integer indicating which type of rule this is.

Defined Constants

UNKNOWN_RULE	The rule is a `CSSUnknownRule`.
STYLE_RULE	The rule is a `CSSStyleRule`.
CHARSET_RULE	The rule is a `CSSCharsetRule`.
IMPORT_RULE	The rule is a `CSSImportRule`.
MEDIA_RULE	The rule is a `CSSMediaRule`.
FONT_FACE_RULE	The rule is a `CSSFontFaceRule`.
PAGE_RULE	The rule is a `CSSPageRule`.

Attributes

type of type unsigned short, readonly

The type of the rule, as defined above. The expectation is that binding-specific casting methods can be used to cast down from an instance of the CSSRule interface to the specific derived interface implied by the type.

cssText of type DOMString

The parsable textual representation of the rule. This reflects the current state of the rule and not its initial value.

Exceptions on setting

DOMException

SYNTAX_ERR: Raised if the specified CSS string value has a syntax error and is unparsable.

INVALID_MODIFICATION_ERR: Raised if the specified CSS string value represents a different type of rule than the current one.

HIERARCHY_REQUEST_ERR: Raised if the rule cannot be inserted at this point in the style sheet.

NO_MODIFICATION_ALLOWED_ERR: Raised if the rule is readonly.

parentStyleSheet of type CSSStyleSheet, readonly

The style sheet that contains this rule.

parentRule of type CSSRule, readonly

If this rule is contained inside another rule (e.g. a style rule inside an @media block), this is the containing rule. If this rule is not nested inside any other rules, this returns null.

Interface CSSStyleRule (introduced in DOM Level 2)

The CSSStyleRule interface represents a single rule set in a CSS style sheet.

IDL Definition

// Introduced in DOM Level 2:
interface CSSStyleRule : CSSRule {
           attribute DOMString        selectorText;
                                        // raises(DOMException) on setting

  readonly attribute CSSStyleDeclaration  style;
};

Attributes

selectorText of type DOMString

The textual representation of the selector for the rule set. The implementation may have stripped out insignificant whitespace while parsing the selector.

Exceptions on setting

DOMException

SYNTAX_ERR: Raised if the specified CSS string value has a syntax error and is unparsable.

NO_MODIFICATION_ALLOWED_ERR: Raised if this rule is readonly.

style of type CSSStyleDeclaration, readonly

The declaration-block of this rule set.

Interface CSSMediaRule (introduced in DOM Level 2)

The CSSMediaRule interface represents a @media rule in a CSS style sheet. A @media rule can be used to delimit style rules for specific media types.

IDL Definition

// Introduced in DOM Level 2:
interface CSSMediaRule : CSSRule {
  readonly attribute stylesheets::MediaList  media;
  readonly attribute CSSRuleList      cssRules;
  unsigned long      insertRule(in DOMString rule, 
                                in unsigned long index)
                                        raises(DOMException);
  void               deleteRule(in unsigned long index)
                                        raises(DOMException);
};

Attributes

media of type stylesheets::MediaList, readonly: A list of media types for this rule.
cssRules of type CSSRuleList, readonly: A list of all CSS rules contained within the media block.

Methods

insertRule

Used to insert a new rule into the media block.

Parameters

`DOMString`		`rule`		The parsable text representing the rule. For rule sets this contains both the selector and the style declaration. For at-rules, this specifies both the at-identifier and the rule content.
`unsigned long`		`index`		The index within the media block's rule collection of the rule before which to insert the specified rule. If the specified index is equal to the length of the media blocks's rule collection, the rule will be added to the end of the media block.

Return Value

unsigned long

The index within the media block's rule collection of the newly inserted rule.

Exceptions

DOMException

HIERARCHY_REQUEST_ERR: Raised if the rule cannot be inserted at the specified index. e.g. if an @import rule is inserted after a standard rule set or other at-rule.

INDEX_SIZE_ERR: Raised if the specified index is not a valid insertion point.

NO_MODIFICATION_ALLOWED_ERR: Raised if this media rule is readonly.

SYNTAX_ERR: Raised if the specified rule has a syntax error and is unparsable.

deleteRule

Used to delete a rule from the media block.

Parameters

unsigned long

index

The index within the media block's rule collection of the rule to remove.

Exceptions

DOMException

INDEX_SIZE_ERR: Raised if the specified index does not correspond to a rule in the media rule list.

NO_MODIFICATION_ALLOWED_ERR: Raised if this media rule is readonly.

No Return Value

Interface CSSFontFaceRule (introduced in DOM Level 2)

The CSSFontFaceRule interface represents a @font-face rule in a CSS style sheet. The @font-face rule is used to hold a set of font descriptions.

IDL Definition

// Introduced in DOM Level 2:
interface CSSFontFaceRule : CSSRule {
  readonly attribute CSSStyleDeclaration  style;
};

Attributes

style of type CSSStyleDeclaration, readonly: The declaration-block of this rule.

Interface CSSPageRule (introduced in DOM Level 2)

The CSSPageRule interface represents a @page rule within a CSS style sheet. The @page rule is used to specify the dimensions, orientation, margins, etc. of a page box for paged media.

IDL Definition

// Introduced in DOM Level 2:
interface CSSPageRule : CSSRule {
           attribute DOMString        selectorText;
                                        // raises(DOMException) on setting

  readonly attribute CSSStyleDeclaration  style;
};

Attributes

selectorText of type DOMString

The parsable textual representation of the page selector for the rule.

Exceptions on setting

DOMException

SYNTAX_ERR: Raised if the specified CSS string value has a syntax error and is unparsable.

NO_MODIFICATION_ALLOWED_ERR: Raised if this rule is readonly.

style of type CSSStyleDeclaration, readonly

The declaration-block of this rule.

Interface CSSImportRule (introduced in DOM Level 2)

The CSSImportRule interface represents a @import rule within a CSS style sheet. The @import rule is used to import style rules from other style sheets.

IDL Definition

// Introduced in DOM Level 2:
interface CSSImportRule : CSSRule {
  readonly attribute DOMString        href;
  readonly attribute stylesheets::MediaList  media;
  readonly attribute CSSStyleSheet    styleSheet;
};

Attributes

href of type DOMString, readonly: The location of the style sheet to be imported. The attribute will not contain the "url(...)" specifier around the URI.
media of type stylesheets::MediaList, readonly: A list of media types for which this style sheet may be used.
styleSheet of type CSSStyleSheet, readonly: The style sheet referred to by this rule, if it has been loaded. The value of this attribute is null if the style sheet has not yet been loaded or if it will not be loaded (e.g. if the style sheet is for a media type not supported by the user agent).

Interface CSSCharsetRule (introduced in DOM Level 2)

The CSSCharsetRule interface represents a @charset rule in a CSS style sheet. The value of the encoding attribute does not at all affect the encoding of text data in the DOM objects; this encoding is always UTF-16. After a stylesheet is loaded, the value of the encoding attribute is the value found in the @charset rule. If there was no @charset in the original document, then no CSSCharsetRule is created. The value of the encoding attribute may also be used as a hint for the encoding used on serialization of the style sheet.

IDL Definition

// Introduced in DOM Level 2:
interface CSSCharsetRule : CSSRule {
           attribute DOMString        encoding;
                                        // raises(DOMException) on setting

};

Attributes

encoding of type DOMString

The encoding information used in this @charset rule.

Exceptions on setting

DOMException

SYNTAX_ERR: Raised if the specified encoding value has a syntax error and is unparsable.

NO_MODIFICATION_ALLOWED_ERR: Raised if this encoding rule is readonly.

Interface CSSUnknownRule (introduced in DOM Level 2)

The CSSUnknownRule interface represents an at-rule not supported by this user agent.

IDL Definition

// Introduced in DOM Level 2:
interface CSSUnknownRule : CSSRule {
};

Interface CSSStyleDeclaration (introduced in DOM Level 2)

The CSSStyleDeclaration interface represents a single CSS declaration block. This interface may be used to determine the style properties currently set in a block or to set style properties explicitly within the block.

While an implementation may not recognize all CSS properties within a CSS declaration block, it is expected to provide access to all specified properties through the CSSStyleDeclaration interface. Furthermore, implementations that support a specific level of CSS should correctly handle CSS shorthand properties for that level. For a further discussion of shorthand properties, see the CSS2Properties interface.

IDL Definition

// Introduced in DOM Level 2:
interface CSSStyleDeclaration {
           attribute DOMString        cssText;
                                        // raises(DOMException) on setting

  DOMString          getPropertyValue(in DOMString propertyName);
  CSSValue           getPropertyCSSValue(in DOMString propertyName);
  DOMString          removeProperty(in DOMString propertyName)
                                        raises(DOMException);
  DOMString          getPropertyPriority(in DOMString propertyName);
  void               setProperty(in DOMString propertyName, 
                                 in DOMString value, 
                                 in DOMString priority)
                                        raises(DOMException);
  readonly attribute unsigned long    length;
  DOMString          item(in unsigned long index);
  readonly attribute CSSRule          parentRule;
};

Attributes

cssText of type DOMString

The parsable textual representation of the declaration block (excluding the surrounding curly braces). Setting this attribute will result in the parsing of the new value and resetting of the properties in the declaration block.

Exceptions on setting

DOMException

SYNTAX_ERR: Raised if the specified CSS string value has a syntax error and is unparsable.

NO_MODIFICATION_ALLOWED_ERR: Raised if this declaration is readonly or a property is readonly.

length of type unsigned long, readonly

The number of properties that have been explicitly set in this declaration block.

parentRule of type CSSRule, readonly

The CSS rule that contains this declaration block or null if this CSSStyleDeclaration is not attached to a CSSRule.

Methods

getPropertyValue

Used to retrieve the value of a CSS property if it has been explicitly set within this declaration block.

Parameters

DOMString

propertyName

The name of the CSS property. See the CSS property index.

Return Value

DOMString

Returns the value of the property if it has been explicitly set for this declaration block. Returns the empty string if the property has not been set.

No Exceptions

getPropertyCSSValue

Used to retrieve the object representation of the value of a CSS property if it has been explicitly set within this declaration block. This method returns null if the property is a shorthand property. Shorthand property values can only be accessed and modified as strings, using the getPropertyValue and setProperty methods.

Parameters

DOMString

propertyName

The name of the CSS property. See the CSS property index.

Return Value

CSSValue

Returns the value of the property if it has been explicitly set for this declaration block. Returns null if the property has not been set.

No Exceptions

removeProperty

Used to remove a CSS property if it has been explicitly set within this declaration block.

Parameters

DOMString

propertyName

The name of the CSS property. See the CSS property index.

Return Value

DOMString

Returns the value of the property if it has been explicitly set for this declaration block. Returns the empty string if the property has not been set or the property name does not correspond to a valid CSS2 property.

Exceptions

DOMException

NO_MODIFICATION_ALLOWED_ERR: Raised if this declaration is readonly or the property is readonly.

getPropertyPriority

Used to retrieve the priority of a CSS property (e.g. the "important" qualifier) if the property has been explicitly set in this declaration block.

Parameters

DOMString

propertyName

The name of the CSS property. See the CSS property index.

Return Value

DOMString

A string representing the priority (e.g. "important") if one exists. The empty string if none exists.

No Exceptions

setProperty

Used to set a property value and priority within this declaration block.

Parameters

`DOMString`	`propertyName`	The name of the CSS property. See the CSS property index.
`DOMString`	`value`	The new value of the property.
`DOMString`	`priority`	The new priority of the property (e.g. `"important"`).

Exceptions

DOMException

SYNTAX_ERR: Raised if the specified value has a syntax error and is unparsable.

NO_MODIFICATION_ALLOWED_ERR: Raised if this declaration is readonly or the property is readonly.

No Return Value

item

Used to retrieve the properties that have been explicitly set in this declaration block. The order of the properties retrieved using this method does not have to be the order in which they were set. This method can be used to iterate over all properties in this declaration block.

Parameters

unsigned long

index

Index of the property name to retrieve.

Return Value

DOMString

The name of the property at this ordinal position. The empty string if no property exists at this position.

No Exceptions

Interface CSSValue (introduced in DOM Level 2)

The CSSValue interface represents a simple or a complex value. A CSSValue object only occurs in a context of a CSS property.

IDL Definition

// Introduced in DOM Level 2:
interface CSSValue {
  // UnitTypes
  const unsigned short      CSS_INHERIT                    = 0;
  const unsigned short      CSS_PRIMITIVE_VALUE            = 1;
  const unsigned short      CSS_VALUE_LIST                 = 2;
  const unsigned short      CSS_CUSTOM                     = 3;

           attribute DOMString        cssText;
                                        // raises(DOMException) on setting

  readonly attribute unsigned short   valueType;
};

Definition group UnitTypes

An integer indicating which type of unit applies to the value.

Defined Constants

CSS_INHERIT	The value is inherited.
CSS_PRIMITIVE_VALUE	The value is a primitive value and an instance of the `CSSPrimitiveValue` interface can be obtained by using binding-specific casting methods on this instance of the `CSSValue` interface.
CSS_VALUE_LIST	The value is a list `CSSValue`.
CSS_CUSTOM	The value is a custom value.

Attributes

cssText of type DOMString

A string representation of the current value.

Exceptions on setting

DOMException

SYNTAX_ERR: Raised if the specified CSS string value has a syntax error (according to the attached property) or is unparsable.

NO_MODIFICATION_ALLOWED_ERR: Raised if this value is readonly.

valueType of type unsigned short, readonly

A code defining the type of the value as defined above.

Interface CSSPrimitiveValue (introduced in DOM Level 2)

The CSSPrimitiveValue interface represents a single CSS value. This interface may be used to determine the value of a specific style property currently set in a block or to set a specific style property explicitly within the block. An instance of this interface can be obtained from the getPropertyCSSValue method of the CSSStyleDeclaration interface. A CSSPrimitiveValue object only occurs in a context of a CSS property.

Conversions are allowed between absolute values (from millimeters to centimeters, from degrees to radians, and so on) but not between relative values (for example, a pixel value can't be converted to a centimeter value). Percentage values can't be converted since they are relative to the parent value (or another property value). There is one exception with color percentage values; since a color percentage value is relative to the range 0-255, a color percentage value can be converted to a number (see also the RGBColor interface).

IDL Definition

// Introduced in DOM Level 2:
interface CSSPrimitiveValue : CSSValue {
  // UnitTypes
  const unsigned short      CSS_UNKNOWN                    = 0;
  const unsigned short      CSS_NUMBER                     = 1;
  const unsigned short      CSS_PERCENTAGE                 = 2;
  const unsigned short      CSS_EMS                        = 3;
  const unsigned short      CSS_EXS                        = 4;
  const unsigned short      CSS_PX                         = 5;
  const unsigned short      CSS_CM                         = 6;
  const unsigned short      CSS_MM                         = 7;
  const unsigned short      CSS_IN                         = 8;
  const unsigned short      CSS_PT                         = 9;
  const unsigned short      CSS_PC                         = 10;
  const unsigned short      CSS_DEG                        = 11;
  const unsigned short      CSS_RAD                        = 12;
  const unsigned short      CSS_GRAD                       = 13;
  const unsigned short      CSS_MS                         = 14;
  const unsigned short      CSS_S                          = 15;
  const unsigned short      CSS_HZ                         = 16;
  const unsigned short      CSS_KHZ                        = 17;
  const unsigned short      CSS_DIMENSION                  = 18;
  const unsigned short      CSS_STRING                     = 19;
  const unsigned short      CSS_URI                        = 20;
  const unsigned short      CSS_IDENT                      = 21;
  const unsigned short      CSS_ATTR                       = 22;
  const unsigned short      CSS_COUNTER                    = 23;
  const unsigned short      CSS_RECT                       = 24;
  const unsigned short      CSS_RGBCOLOR                   = 25;

  readonly attribute unsigned short   primitiveType;
  void               setFloatValue(in unsigned short unitType, 
                                   in float floatValue)
                                        raises(DOMException);
  float              getFloatValue(in unsigned short unitType)
                                        raises(DOMException);
  void               setStringValue(in unsigned short stringType, 
                                    in DOMString stringValue)
                                        raises(DOMException);
  DOMString          getStringValue()
                                        raises(DOMException);
  Counter            getCounterValue()
                                        raises(DOMException);
  Rect               getRectValue()
                                        raises(DOMException);
  RGBColor           getRGBColorValue()
                                        raises(DOMException);
};

Definition group UnitTypes

An integer indicating which type of unit applies to the value.

Defined Constants

CSS_UNKNOWN	The value is not a recognized CSS2 value. The value can only be obtained by using the `cssText` attribute.
CSS_NUMBER	The value is a simple number. The value can be obtained by using the `getFloatValue` method.
CSS_PERCENTAGE	The value is a percentage. The value can be obtained by using the `getFloatValue` method.
CSS_EMS	The value is length (ems). The value can be obtained by using the `getFloatValue` method.
CSS_EXS	The value is length (exs). The value can be obtained by using the `getFloatValue` method.
CSS_PX	The value is length (px). The value can be obtained by using the `getFloatValue` method.
CSS_CM	The value is length (cm). The value can be obtained by using the `getFloatValue` method.
CSS_MM	The value is length (mm). The value can be obtained by using the `getFloatValue` method.
CSS_IN	The value is length (in). The value can be obtained by using the `getFloatValue` method.
CSS_PT	The value is length (pt). The value can be obtained by using the `getFloatValue` method.
CSS_PC	The value is a length (pc). The value can be obtained by using the `getFloatValue` method.
CSS_DEG	The value is an angle (deg). The value can be obtained by using the `getFloatValue` method.
CSS_RAD	The value is an angle (rad). The value can be obtained by using the `getFloatValue` method.
CSS_GRAD	The value is an angle (grad). The value can be obtained by using the `getFloatValue` method.
CSS_MS	The value is a time (ms). The value can be obtained by using the `getFloatValue` method.
CSS_S	The value is a time (s). The value can be obtained by using the `getFloatValue` method.
CSS_HZ	The value is a frequency (Hz). The value can be obtained by using the `getFloatValue` method.
CSS_KHZ	The value is a frequency (kHz). The value can be obtained by using the `getFloatValue` method.
CSS_DIMENSION	The value is a number with an unknown dimension. The value can be obtained by using the `getFloatValue` method.
CSS_STRING	The value is a STRING. The value can be obtained by using the `getStringValue` method.
CSS_URI	The value is a URI. The value can be obtained by using the `getStringValue` method.
CSS_IDENT	The value is an identifier. The value can be obtained by using the `getStringValue` method.
CSS_ATTR	The value is a attribute function. The value can be obtained by using the `getStringValue` method.
CSS_COUNTER	The value is a counter or counters function. The value can be obtained by using the `getCounterValue` method.
CSS_RECT	The value is a rect function. The value can be obtained by using the `getRectValue` method.
CSS_RGBCOLOR	The value is a RGB color. The value can be obtained by using the `getRGBColorValue` method.

Attributes

primitiveType of type unsigned short, readonly: The type of the value as defined by the constants specified above.

Methods

setFloatValue

A method to set the float value with a specified unit. If the property attached with this value can not accept the specified unit or the float value, the value will be unchanged and a DOMException will be raised.

Parameters

`unsigned short`		`unitType`		A unit code as defined above. The unit code can only be a float unit type (e.g. `CSS_NUMBER`, `CSS_PERCENTAGE`, `CSS_EMS`, `CSS_EXS`, `CSS_PX`, `CSS_CM`, `CSS_MM`, `CSS_IN`, `CSS_PT`, `CSS_PC`, `CSS_DEG`, `CSS_RAD`, `CSS_GRAD`, `CSS_MS`, `CSS_S`, `CSS_HZ`, `CSS_KHZ`, `CSS_DIMENSION`).
`float`		`floatValue`		The new float value.

Exceptions

DOMException

INVALID_ACCESS_ERR: Raised if the attached property doesn't support the float value or the unit type.

NO_MODIFICATION_ALLOWED_ERR: Raised if this property is readonly.

No Return Value

getFloatValue

This method is used to get a float value in a specified unit. If this CSS value doesn't contain a float value or can't be converted into the specified unit, a DOMException is raised.

Parameters

unsigned short

unitType

A unit code to get the float value. The unit code can only be a float unit type (e.g. CSS_NUMBER, CSS_PERCENTAGE, CSS_EMS, CSS_EXS, CSS_PX, CSS_CM, CSS_MM, CSS_IN, CSS_PT, CSS_PC, CSS_DEG, CSS_RAD, CSS_GRAD, CSS_MS, CSS_S, CSS_HZ, CSS_KHZ, CSS_DIMENSION).

Return Value

float

The float value in the specified unit.

Exceptions

DOMException

INVALID_ACCESS_ERR: Raised if the CSS value doesn't contain a float value or if the float value can't be converted into the specified unit.

setStringValue

A method to set the string value with a specified unit. If the property attached to this value can't accept the specified unit or the string value, the value will be unchanged and a DOMException will be raised.

Parameters

`unsigned short`		`stringType`		A string code as defined above. The string code can only be a string unit type (e.g. `CSS_STRING`, `CSS_URI`, `CSS_IDENT`, and `CSS_ATTR`).
`DOMString`		`stringValue`		The new string value.

Exceptions

DOMException

INVALID_ACCESS_ERR: Raised if the CSS value doesn't contain a string value or if the string value can't be converted into the specified unit.

NO_MODIFICATION_ALLOWED_ERR: Raised if this property is readonly.

No Return Value

getStringValue

This method is used to get the string value in a specified unit. If the CSS value doesn't contain a string value, a DOMException is raised.

Note: Some properties (like 'font-family' or 'voice-family') convert a whitespace separated list of idents to a string.

Return Value

DOMString

The string value in the current unit. The current valueType can only be a string unit type (e.g. CSS_STRING, CSS_URI, CSS_IDENT and CSS_ATTR).

Exceptions

DOMException

INVALID_ACCESS_ERR: Raised if the CSS value doesn't contain a string value.

No Parameters

getCounterValue

This method is used to get the Counter value. If this CSS value doesn't contain a counter value, a DOMException is raised. Modification to the corresponding style property can be achieved using the Counter interface.

Return Value

Counter

The Counter value.

Exceptions

DOMException

INVALID_ACCESS_ERR: Raised if the CSS value doesn't contain a Counter value (e.g. this is not CSS_COUNTER).

No Parameters

getRectValue

This method is used to get the Rect value. If this CSS value doesn't contain a rect value, a DOMException is raised. Modification to the corresponding style property can be achieved using the Rect interface.

Return Value

Rect

The Rect value.

Exceptions

DOMException

INVALID_ACCESS_ERR: Raised if the CSS value doesn't contain a Rect value. (e.g. this is not CSS_RECT).

No Parameters

getRGBColorValue

This method is used to get the RGB color. If this CSS value doesn't contain a RGB color value, a DOMException is raised. Modification to the corresponding style property can be achieved using the RGBColor interface.

Return Value

RGBColor

the RGB color value.

Exceptions

DOMException

INVALID_ACCESS_ERR: Raised if the attached property can't return a RGB color value (e.g. this is not CSS_RGBCOLOR).

No Parameters

Interface CSSValueList (introduced in DOM Level 2)

The CSSValueList interface provides the abstraction of an ordered collection of CSS values.

Some properties allow an empty list into their syntax. In that case, these properties take the none identifier. So, an empty list means that the property has the value none.

IDL Definition

// Introduced in DOM Level 2:
interface CSSValueList : CSSValue {
  readonly attribute unsigned long    length;
  CSSValue           item(in unsigned long index);
};

Attributes

length of type unsigned long, readonly: The number of CSSValues in the list. The range of valid values of the indices is 0 to length-1 inclusive.
For

Methods

item

Used to retrieve a CSS rule by ordinal index. The order in this collection represents the order of the values in the CSS style property.

Parameters

unsigned long

index

Index into the collection.

Return Value

CSSValue

The style rule at the index position in the CSSValueList, or null if that is not a valid index.

No Exceptions

Interface RGBColor (introduced in DOM Level 2)

The RGBColor interface is used to represent any RGB color value. This interface reflects the values in the underlying style property. Hence, modifications made to the CSSPrimitiveValue objects modify the style property.

A specified RGB color is not clipped (even if the number is outside the range 0-255 or 0%-100%). A computed RGB color is clipped depending on the device.

Even if a style sheet can only contain an integer for a color value, the internal storage of this integer is a float, and this can be used as a float in the specified or the computed style.

A color percentage value can always be converted to a number and vice versa.

IDL Definition

// Introduced in DOM Level 2:
interface RGBColor {
  readonly attribute CSSPrimitiveValue  red;
  readonly attribute CSSPrimitiveValue  green;
  readonly attribute CSSPrimitiveValue  blue;
};

Attributes

red of type CSSPrimitiveValue, readonly: This attribute is used for the red value of the RGB color.
green of type CSSPrimitiveValue, readonly: This attribute is used for the green value of the RGB color.
blue of type CSSPrimitiveValue, readonly: This attribute is used for the blue value of the RGB color.

Interface Rect (introduced in DOM Level 2)

The Rect interface is used to represent any rect value. This interface reflects the values in the underlying style property. Hence, modifications made to the CSSPrimitiveValue objects modify the style property.

IDL Definition

// Introduced in DOM Level 2:
interface Rect {
  readonly attribute CSSPrimitiveValue  top;
  readonly attribute CSSPrimitiveValue  right;
  readonly attribute CSSPrimitiveValue  bottom;
  readonly attribute CSSPrimitiveValue  left;
};

Attributes

top of type CSSPrimitiveValue, readonly: This attribute is used for the top of the rect.
right of type CSSPrimitiveValue, readonly: This attribute is used for the right of the rect.
bottom of type CSSPrimitiveValue, readonly: This attribute is used for the bottom of the rect.
left of type CSSPrimitiveValue, readonly: This attribute is used for the left of the rect.

Interface Counter (introduced in DOM Level 2)

The Counter interface is used to represent any counter or counters function value. This interface reflects the values in the underlying style property. Hence, modifications made to the CSSPrimitiveValue objects modify the style property.

IDL Definition

// Introduced in DOM Level 2:
interface Counter {
  readonly attribute DOMString        identifier;
  readonly attribute DOMString        listStyle;
  readonly attribute DOMString        separator;
};

Attributes

identifier of type DOMString, readonly: This attribute is used for the identifier of the counter.
listStyle of type DOMString, readonly: This attribute is used for the style of the list.
separator of type DOMString, readonly: This attribute is used for the separator of the nested counters.

5.2.1. Override and computed style sheet

Interface ViewCSS (introduced in DOM Level 2)

This interface represents a CSS view. The getComputedStyle method provides a read only access to the computed values of an element.

The expectation is that an instance of the ViewCSS interface can be obtained by using binding-specific casting methods on an instance of the View interface.

Since a computed style is related to an Element node, if this element is removed from the document, the associated CSSStyleDeclaration and CSSValue related to this declaration are no longer valid.

IDL Definition

// Introduced in DOM Level 2:
interface ViewCSS : views::AbstractView {
  CSSStyleDeclaration getComputedStyle(in Element elt, 
                                       in DOMString pseudoElt);
};

Methods

getComputedStyle

This method is used to get the computed style as it is defined in [CSS2].

Parameters

`Element`		`elt`		The element whose style is to be computed. This parameter cannot be null.
`DOMString`		`pseudoElt`		The pseudo-element or `null` if none.

Return Value

CSSStyleDeclaration

The computed style. The CSSStyleDeclaration is read-only and contains only absolute values.

No Exceptions

Interface DocumentCSS (introduced in DOM Level 2)

This interface represents a document with a CSS view.

The getOverrideStyle method provides a mechanism through which a DOM author could effect immediate change to the style of an element without modifying the explicitly linked stylesheets of a document or the inline style of elements in the stylesheets. This style sheet comes after the author style sheet in the cascade algorithm and is called override style sheet. The override style sheet takes precedence over author style sheet. An "!important" declaration still takes precedence over a normal declaration. Both override and user style sheets may contain "!important" declarations, and user "!important" rules take precedence over override "!important" rules. Both author and override style sheets may contain "!important" declarations, and override "!important" rules takes precedence over author "!important" rules.

The expectation is that an instance of the DocumentCSS interface can be obtained by using binding-specific casting methods on an instance of the Document interface.

IDL Definition

// Introduced in DOM Level 2:
interface DocumentCSS : stylesheets::DocumentStyle {
  CSSStyleDeclaration getOverrideStyle(in Element elt, 
                                       in DOMString pseudoElt);
};

Methods

getOverrideStyle

This method is used to retrieve the override style declaration for a specified element and a specified pseudo-element.

Parameters

`Element`		`elt`		The element whose style is to be modified. This parameter cannot be null.
`DOMString`		`pseudoElt`		The pseudo element or `null` if none.

Return Value

CSSStyleDeclaration

The override style declaration.

No Exceptions

5.2.2. Style sheet creation

Interface DOMImplementationCSS (introduced in DOM Level 2)

This interface allows the DOM user to create a CSS style sheet outside the context of a document. There is no way to associate the new CSS style sheet with a document in DOM Level 2.

IDL Definition

// Introduced in DOM   Level 2:
interface DOMImplementationCSS : DOMImplementation {
  CSSStyleSheet      createCSSStyleSheet(in DOMString title, 
                                         inout DOMString media);
};

Methods

createCSSStyleSheet

Creates a new CSS style sheet.

Parameters

`DOMString`		`title`		The advisory title. See also Style Sheet Interfaces.
`DOMString`		`media`		The media associated with the new style sheet. See also Style Sheet Interfaces.

Return Value

CSSStyleSheet

A new CSS style sheet.

No Exceptions

5.2.3. Element with CSS inline style

Interface ElementCSSInlineStyle (introduced in DOM Level 2)

Inline style information attached to elements is exposed through the style attribute. This represents the contents of the STYLE attribute for HTML elements (or elements in other schemas or DTDs which use the STYLE attribute in the same way).

IDL Definition

// Introduced in DOM Level 2:
interface ElementCSSInlineStyle {
  readonly attribute CSSStyleDeclaration  style;
};

Attributes

style of type CSSStyleDeclaration, readonly: The style attribute.

5.3. CSS Extended Interfaces

The interfaces found within this section are not mandatory. A DOM application can use the hasFeature method of the DOMImplementation interface to determine whether they are supported or not. The feature string for all the extended interfaces listed in this section is "CSS2".

The following table specifies the type of CSSValue used to represent each property that can be specified in a CSSStyleDeclaration found in a CSSStyleRule for a CSS Level 2 style sheet. The expectation is that the CSSValue returned from the getPropertyCSSValue method on the CSSStyleDeclaration interface can be cast down, using binding-specific casting methods, to the specific derived interface.

For properties that are represented by a custom interface (the valueType of the CSSValue is CSS_CUSTOM), the name of the derived interface is specified in the table. For properties that consist of lists of values (the valueType of the CSSValue is CSS_VALUE_LIST), the derived interface is CSSValueList. For all other properties (the valueType of the CSSValue is CSS_PRIMITIVE_VALUE), the derived interface is CSSPrimitiveValue.
Property Name Representation

azimuth CSS2Azimuth

background null

background-attachment ident

background-color rgbcolor, ident

background-image uri, ident

background-position CSS2BackgroundPosition

background-repeat ident

border null

border-collapse ident

border-color null

border-spacing CSS2BorderSpacing

border-style null

border-top, border-right, border-bottom, border-left null

border-top-color, border-right-color, border-bottom-color, border-left-color rgbcolor, ident

border-top-style, border-right-style, border-bottom-style, border-left-style ident

border-top-width, border-right-width, border-bottom-width, border-left-width length, ident

border-width null

bottom length, percentage, ident

caption-side ident

clear ident

clip rect, ident

color rgbcolor, ident

content list of string, uri, counter, attr, ident

counter-increment list of CSS2CounterIncrement

counter-reset list of CSS2CounterReset

cue null

cue-after, cue-before uri, ident

cursor CSS2Cursor

direction ident

display ident

elevation angle, ident

empty-cells ident

float ident

font null

font-family list of strings and idents

font-size ident, length, percentage

font-size-adjust number, ident

font-stretch ident

font-style ident

font-variant ident

font-weight ident

height length, percentage, ident

left length, percentage, ident

letter-spacing ident, length

line-height ident, length, percentage, number

list-style null

list-style-image uri, ident

list-style-position ident

list-style-type ident

margin null

margin-top, margin-right, margin-bottom, margin-left length, percentage, ident

marker-offset length, ident

max-height length, percentage, ident

max-width length, percentage, ident

min-height length, percentage, ident

min-width length, percentage, ident

orphans number

outline null

outline-color rgbcolor, ident

outline-style ident

outline-width length, ident

overflow ident

padding null

padding-top, padding-right, padding-bottom, padding-left length, percentage

page ident

page-break-after ident

page-break-before ident

page-break-inside ident

pause null

pause-after, pause-before time, percentage

pitch frequency, identifier

pitch-range number

play-during CSS2PlayDuring

position ident

quotes list of string or ident

richness number

right length, percentage, ident

speak ident

speak-header ident

speak-numeral ident

speak-punctuation ident

speech-rate number, ident

stress number

table-layout ident

text-align ident, string

text-decoration list of ident

text-indent length, percentage

text-shadow list of CSS2TextShadow

text-transform ident

top length, percentage, ident

unicode-bidi ident

vertical-align ident, percentage, length

visibility ident

voice-family list of strings and idents

volume number, percentage, ident

white-space ident

widows number

width length, percentage, ident

word-spacing length, ident

z-index ident, number

Interface CSS2Azimuth (introduced in DOM Level 2)

The CSS2Azimuth interface represents the azimuth CSS Level 2 property.

IDL Definition

// Introduced in DOM Level 2:
interface CSS2Azimuth : CSSValue {
  readonly attribute unsigned short   azimuthType;
  readonly attribute DOMString        identifier;
  readonly attribute boolean          behind;
  void               setAngleValue(in unsigned short uType, 
                                   in float fValue)
                                        raises(DOMException);
  float              getAngleValue(in unsigned short uType)
                                        raises(DOMException);
  void               setIdentifier(in DOMString ident, 
                                   in boolean b)
                                        raises(DOMException);
};

Attributes

azimuthType of type unsigned short, readonly: A code defining the type of the value as defined in CSSValue. It would be one of CSS_DEG, CSS_RAD, CSS_GRAD or CSS_IDENT.
identifier of type DOMString, readonly: If azimuthType is CSS_IDENT, identifier contains one of left-side, far-left, left, center-left, center, center-right, right, far-right, right-side, leftwards, rightwards. The empty string if none is set.
behind of type boolean, readonly: behind indicates whether the behind identifier has been set.

Methods

setAngleValue

A method to set the angle value with a specified unit. This method will unset any previously set identifiers values.

Parameters

`unsigned short`		`uType`		The unitType could only be one of `CSS_DEG`, `CSS_RAD` or `CSS_GRAD`).
`float`		`fValue`		The new float value of the angle.

Exceptions

DOMException

INVALID_ACCESS_ERR: Raised if the unit type is invalid.

NO_MODIFICATION_ALLOWED_ERR: Raised if this property is readonly.

No Return Value

getAngleValue

Used to retrieved the float value of the azimuth property.

Parameters

unsigned short

uType

The unit type can be only an angle unit type (CSS_DEG, CSS_RAD or CSS_GRAD).

Return Value

float

The float value.

Exceptions

DOMException

INVALID_ACCESS_ERR: Raised if the unit type is invalid.

setIdentifier

Setting the identifier for the azimuth property will unset any previously set angle value. The value of azimuthType is set to CSS_IDENT

Parameters

`DOMString`		`ident`		The new identifier. If the identifier is "leftwards" or "rightward", the behind attribute is ignored.
`boolean`		`b`		The new value for behind.

Exceptions

DOMException

SYNTAX_ERR: Raised if the specified identifier has a syntax error and is unparsable.

NO_MODIFICATION_ALLOWED_ERR: Raised if this property is readonly.

No Return Value

Interface CSS2BackgroundPosition (introduced in DOM Level 2)

The CSS2BackgroundPosition interface represents the background-position CSS Level 2 property.

IDL Definition

// Introduced in DOM Level 2:
interface CSS2BackgroundPosition : CSSValue {
  readonly attribute unsigned short   horizontalType;
  readonly attribute unsigned short   verticalType;
  readonly attribute DOMString        horizontalIdentifier;
  readonly attribute DOMString        verticalIdentifier;
  float              getHorizontalPosition(in float hType)
                                        raises(DOMException);
  float              getVerticalPosition(in float vType)
                                        raises(DOMException);
  void               setHorizontalPosition(in unsigned short hType, 
                                           in float value)
                                        raises(DOMException);
  void               setVerticalPosition(in unsigned short vType, 
                                         in float value)
                                        raises(DOMException);
  void               setPositionIdentifier(in DOMString hIdentifier, 
                                           in DOMString vIdentifier)
                                        raises(DOMException);
};

Attributes

horizontalType of type unsigned short, readonly: A code defining the type of the horizontal value. It would be one CSS_PERCENTAGE, CSS_EMS, CSS_EXS, CSS_PX, CSS_CM, CSS_MM, CSS_IN, CSS_PT, CSS_PC or CSS_IDENT. If one of horizontal or vertical is CSS_IDENT, it's guaranteed that the other is the same.
verticalType of type unsigned short, readonly: A code defining the type of the horizontal value. The code can be one of the following units : CSS_PERCENTAGE, CSS_EMS, CSS_EXS, CSS_PX, CSS_CM, CSS_MM, CSS_IN, CSS_PT, CSS_PC, CSS_IDENT, CSS_INHERIT. If one of horizontal or vertical is CSS_IDENT or CSS_INHERIT, it's guaranteed that the other is the same.
horizontalIdentifier of type DOMString, readonly: If horizontalType is CSS_IDENT or CSS_INHERIT, this attribute contains the string representation of the ident, otherwise it contains an empty string.
verticalIdentifier of type DOMString, readonly: If verticalType is CSS_IDENT or CSS_INHERIT, this attribute contains the string representation of the ident, otherwise it contains an empty string. The value is "center" if only the horizontalIdentifier has been set.

Methods

getHorizontalPosition

This method is used to get the float value in a specified unit if the horizontalPosition represents a length or a percentage. If the float doesn't contain a float value or can't be converted into the specified unit, a DOMException is raised.

Parameters

float

hType

The horizontal unit.

Return Value

float

The float value.

Exceptions

DOMException

INVALID_ACCESS_ERR: Raised if the property doesn't contain a float or the value can't be converted.

getVerticalPosition

This method is used to get the float value in a specified unit if the verticalPosition represents a length or a percentage. If the float doesn't contain a float value or can't be converted into the specified unit, a DOMException is raised. The value is 50% if only the horizontal value has been specified.

Parameters

float

vType

The vertical unit.

Return Value

float

The float value.

Exceptions

DOMException

INVALID_ACCESS_ERR: Raised if the property doesn't contain a float or the value can't be converted.

setHorizontalPosition

This method is used to set the horizontal position with a specified unit. If the vertical value is not a percentage or a length, it sets the vertical position to 50%.

Parameters

`unsigned short`		`hType`		The specified unit (a length or a percentage).
`float`		`value`		The new value.

Exceptions

DOMException

INVALID_ACCESS_ERR: Raised if the specified unit is not a length or a percentage.

NO_MODIFICATION_ALLOWED_ERR: Raised if this property is readonly.

No Return Value

setVerticalPosition

This method is used to set the vertical position with a specified unit. If the horizontal value is not a percentage or a length, it sets the vertical position to 50%.

Parameters

`unsigned short`		`vType`		The specified unit (a length or a percentage).
`float`		`value`		The new value.

Exceptions

DOMException

INVALID_ACCESS_ERR: Raised if the specified unit is not a length or a percentage.

NO_MODIFICATION_ALLOWED_ERR: Raised if this property is readonly.

No Return Value

setPositionIdentifier

Sets the identifiers. If the second identifier is the empty string, the vertical identifier is set to his default value ("center").

Parameters

`DOMString`		`hIdentifier`		The new horizontal identifier.
`DOMString`		`vIdentifier`		The new vertical identifier.

Exceptions

DOMException

SYNTAX_ERR: Raised if the identifiers have a syntax error and is unparsable.

NO_MODIFICATION_ALLOWED_ERR: Raised if this property is readonly.

No Return Value

Interface CSS2BorderSpacing (introduced in DOM Level 2)

The CSS2BorderSpacing interface represents the border-spacing CSS Level 2 property.

IDL Definition

// Introduced in DOM Level 2:
interface CSS2BorderSpacing : CSSValue {
  readonly attribute unsigned short   horizontalType;
  readonly attribute unsigned short   verticalType;
  float              getHorizontalSpacing(in float hType)
                                        raises(DOMException);
  float              getVerticalSpacing(in float vType)
                                        raises(DOMException);
  void               setHorizontalSpacing(in unsigned short hType, 
                                          in float value)
                                        raises(DOMException);
  void               setVerticalSpacing(in unsigned short vType, 
                                        in float value)
                                        raises(DOMException);
};

Attributes

horizontalType of type unsigned short, readonly: The A code defining the type of the value as defined in CSSValue. It would be one of CSS_EMS, CSS_EXS, CSS_PX, CSS_CM, CSS_MM, CSS_IN, CSS_PT or CSS_PC.
verticalType of type unsigned short, readonly: The A code defining the type of the value as defined in CSSValue. It would be one of CSS_EMS, CSS_EXS, CSS_PX, CSS_CM, CSS_MM, CSS_IN, CSS_PT, CSS_PC or CSS_INHERIT.

Methods

getHorizontalSpacing

This method is used to get the float value in a specified unit if the horizontalSpacing represents a length. If the float doesn't contain a float value or can't be converted into the specified unit, a DOMException is raised.

Parameters

float

hType

The horizontal unit.

Return Value

float

The float value.

Exceptions

DOMException

INVALID_ACCESS_ERR: Raised if the property doesn't contain a float or the value can't be converted.

getVerticalSpacing

This method is used to get the float value in a specified unit if the verticalSpacing represents a length. If the float doesn't contain a float value or can't be converted into the specified unit, a DOMException is raised. The value is 0 if only the horizontal value has been specified.

Parameters

float

vType

The vertical unit.

Return Value

float

The float value.

Exceptions

DOMException

INVALID_ACCESS_ERR: Raised if the property doesn't contain a float or the value can't be converted.

setHorizontalSpacing

This method is used to set the horizontal spacing with a specified unit. If the vertical value is a length, it sets the vertical spacing to 0.

Parameters

`unsigned short`		`hType`		The horizontal unit.
`float`		`value`		The new value.

Exceptions

DOMException

INVALID_ACCESS_ERR: Raised if the specified unit is not a length.

NO_MODIFICATION_ALLOWED_ERR: Raised if this property is readonly.

No Return Value

setVerticalSpacing

This method is used to set the vertical spacing with a specified unit. If the horizontal value is not a length, it sets the vertical spacing to 0.

Parameters

`unsigned short`		`vType`		The vertical unit.
`float`		`value`		The new value.

Exceptions

DOMException

INVALID_ACCESS_ERR: Raised if the specified unit is not a length or a percentage.

NO_MODIFICATION_ALLOWED_ERR: Raised if this property is readonly.

No Return Value

Interface CSS2CounterReset (introduced in DOM Level 2)

The CSS2CounterReset interface represents a simple value for the counter-reset CSS Level 2 property.

IDL Definition

// Introduced in DOM Level   2:
interface CSS2CounterReset : CSSValue {
           attribute DOMString        identifier;
                                        // raises(DOMException) on setting

           attribute short            reset;
                                        // raises(DOMException) on setting

};

Attributes

identifier of type DOMString

The element name.

Exceptions on setting

DOMException

SYNTAX_ERR: Raised if the specified identifier has a syntax error and is unparsable.

NO_MODIFICATION_ALLOWED_ERR: Raised if this identifier is readonly.

reset of type short

The reset (default value is 0).

Exceptions on setting

DOMException

NO_MODIFICATION_ALLOWED_ERR: Raised if this identifier is readonly.

Interface CSS2CounterIncrement (introduced in DOM Level 2)

The CSS2CounterIncrement interface represents a simple value for the counter-increment CSS Level 2 property.

IDL Definition

// Introduced in DOM   Level 2:
interface CSS2CounterIncrement : CSSValue {
           attribute DOMString        identifier;
                                        // raises(DOMException) on setting

           attribute short            increment;
                                        // raises(DOMException) on setting

};

Attributes

identifier of type DOMString

The element name.

Exceptions on setting

DOMException

SYNTAX_ERR: Raised if the specified identifier has a syntax error and is unparsable.

NO_MODIFICATION_ALLOWED_ERR: Raised if this identifier is readonly.

increment of type short

The increment (default value is 1).

Exceptions on setting

DOMException

NO_MODIFICATION_ALLOWED_ERR: Raised if this identifier is readonly.

Interface CSS2Cursor (introduced in DOM Level 2)

The CSS2Cursor interface represents the cursor CSS Level 2 property.

IDL Definition

// Introduced in DOM Level 2:
interface CSS2Cursor : CSSValue {
  readonly attribute CSSValueList     uris;
           attribute DOMString        predefinedCursor;
                                        // raises(DOMException) on setting

};

Attributes

uris of type CSSValueList, readonly

uris represents the list of URIs (CSS_URI) on the cursor property. The list can be empty.

predefinedCursor of type DOMString

This identifier represents a generic cursor name or an empty string.

Exceptions on setting

DOMException

SYNTAX_ERR: Raised if the specified CSS string value has a syntax error and is unparsable.

NO_MODIFICATION_ALLOWED_ERR: Raised if this declaration is readonly.

Interface CSS2PlayDuring (introduced in DOM Level 2)

The CSS2PlayDuring interface represents the play-during CSS Level 2 property.

IDL Definition

// Introduced in DOM Level 2:
interface CSS2PlayDuring : CSSValue {
  readonly attribute unsigned short   playDuringType;
           attribute DOMString        playDuringIdentifier;
                                        // raises(DOMException) on setting

           attribute DOMString        uri;
                                        // raises(DOMException) on setting

           attribute boolean          mix;
                                        // raises(DOMException) on setting

           attribute boolean          repeat;
                                        // raises(DOMException) on setting

};

Attributes

playDuringType of type unsigned short, readonly

A code defining the type of the value as define in CSSvalue. It would be one of CSS_UNKNOWN or CSS_IDENT.

playDuringIdentifier of type DOMString

One of "inherit", "auto", "none" or the empty string if the playDuringType is CSS_UNKNOWN. On setting, it will set the uri to the empty string and mix and repeat to false.

Exceptions on setting

DOMException

SYNTAX_ERR: Raised if the specified CSS string value has a syntax error and is unparsable.

NO_MODIFICATION_ALLOWED_ERR: Raised if this declaration is readonly.

uri of type DOMString

The sound specified by the uri. It will set the playDuringType attribute to CSS_UNKNOWN.

Exceptions on setting

DOMException

SYNTAX_ERR: Raised if the specified CSS string value has a syntax error and is unparsable.

NO_MODIFICATION_ALLOWED_ERR: Raised if this declaration is readonly.

mix of type boolean

true if the sound should be mixed. It will be ignored if the attribute doesn't contain a uri.

Exceptions on setting

DOMException

NO_MODIFICATION_ALLOWED_ERR: Raised if this declaration is readonly.

repeat of type boolean

true if the sound should be repeated. It will be ignored if the attribute doesn't contain a uri.

Exceptions on setting

DOMException

NO_MODIFICATION_ALLOWED_ERR: Raised if this declaration is readonly.

Interface CSS2TextShadow (introduced in DOM Level 2)

The CSS2TextShadow interface represents a simple value for the text-shadow CSS Level 2 property.

IDL Definition

// Introduced in DOM Level 2:
interface CSS2TextShadow {
  readonly attribute CSSValue         color;
  readonly attribute CSSValue         horizontal;
  readonly attribute CSSValue         vertical;
  readonly attribute CSSValue         blur;
};

Attributes

color of type CSSValue, readonly: Specified the color of the text shadow. The CSS Value can contain an empty string if no color has been specified.
horizontal of type CSSValue, readonly: The horizontal position of the text shadow. 0 if no length has been specified.
vertical of type CSSValue, readonly: The vertical position of the text shadow. 0 if no length has been specified.
blur of type CSSValue, readonly: The blur radius of the text shadow. 0 if no length has been specified.

The following table specifies the type of CSSValue used to represent each descriptor that can be specified in a

Property Name	Representation
azimuth	`CSS2Azimuth`
background	`null`
background-attachment	ident
background-color	rgbcolor, ident
background-image	uri, ident
background-position	`CSS2BackgroundPosition`
background-repeat	ident
border	`null`
border-collapse	ident
border-color	`null`
border-spacing	`CSS2BorderSpacing`
border-style	`null`
border-top, border-right, border-bottom, border-left	`null`
border-top-color, border-right-color, border-bottom-color, border-left-color	rgbcolor, ident
border-top-style, border-right-style, border-bottom-style, border-left-style	ident
border-top-width, border-right-width, border-bottom-width, border-left-width	length, ident
border-width	`null`
bottom	length, percentage, ident
caption-side	ident
clear	ident
clip	rect, ident
color	rgbcolor, ident
content	list of string, uri, counter, attr, ident
counter-increment	list of `CSS2CounterIncrement`
counter-reset	list of `CSS2CounterReset`
cue	`null`
cue-after, cue-before	uri, ident
cursor	`CSS2Cursor`
direction	ident
display	ident
elevation	angle, ident
empty-cells	ident
float	ident
font	`null`
font-family	list of strings and idents
font-size	ident, length, percentage
font-size-adjust	number, ident
font-stretch	ident
font-style	ident
font-variant	ident
font-weight	ident
height	length, percentage, ident
left	length, percentage, ident
letter-spacing	ident, length
line-height	ident, length, percentage, number
list-style	`null`
list-style-image	uri, ident
list-style-position	ident
list-style-type	ident
margin	`null`
margin-top, margin-right, margin-bottom, margin-left	length, percentage, ident
marker-offset	length, ident
max-height	length, percentage, ident
max-width	length, percentage, ident
min-height	length, percentage, ident
min-width	length, percentage, ident
orphans	number
outline	`null`
outline-color	rgbcolor, ident
outline-style	ident
outline-width	length, ident
overflow	ident
padding	`null`
padding-top, padding-right, padding-bottom, padding-left	length, percentage
page	ident
page-break-after	ident
page-break-before	ident
page-break-inside	ident
pause	`null`
pause-after, pause-before	time, percentage
pitch	frequency, identifier
pitch-range	number
play-during	`CSS2PlayDuring`
position	ident
quotes	list of string or ident
richness	number
right	length, percentage, ident
speak	ident
speak-header	ident
speak-numeral	ident
speak-punctuation	ident
speech-rate	number, ident
stress	number
table-layout	ident
text-align	ident, string
text-decoration	list of ident
text-indent	length, percentage
text-shadow	list of `CSS2TextShadow`
text-transform	ident
top	length, percentage, ident
unicode-bidi	ident
vertical-align	ident, percentage, length
visibility	ident
voice-family	list of strings and idents
volume	number, percentage, ident
white-space	ident
widows	number
width	length, percentage, ident
word-spacing	length, ident
z-index	ident, number

5. Document Object Model CSS

Table of contents

5.1. Overview of the DOM Level 2 CSS Interfaces

5.2. CSS Fundamental Interfaces

5.2.1. Override and computed style sheet

5.2.2. Style sheet creation

5.2.3. Element with CSS inline style

5.3. CSS Extended Interfaces