As stated in the previous tutorial, JavaScript refers to CSS properties differently than CSS itself does. JavaScript never uses hyphens (-) in references and often substitutes capitalization. Proper capitalization is crucial in JavaScript references.

Below is a table of JavaScript references to CSS properties. This table is IE specific. The only difference between IE and other browsers is that other browsers use a different overall reference (instead of "document.all") and may not support the entire number of properties that IE does.

Otherwise, the same term is used to refer to a background color in all browsers (backgroundColor). The same applies to other properties. Again, the only difference is that IE supports more CSS properties in JavaScript and the "document.all" model is not used in other browsers. Specific references in other browsers is covered in the next tutorial.

Downloads

You really should download and print out one of the printer-friendly referrences below. The first is a printer friendly version of the table below. The second is as zipped text version of the same data.

CSS Properties To JavaScript Reference Conversion Table

Usage

Netscape 6.0+ and Opera (and other Mozilla) and IE 5+

document.getElementById(div_id).style.JS_property_reference = "new_CSS_property_value";

Note the use of parentheses instead of square brackets in newer Mozilla's "getElementById()" reference.

Internet Explorer 4.x

document.all.div_id.style.JS_property_reference = "new_CSS_property_value";

Older Netscape's (4.7 and earlier)

document.div_id.JS_property_reference = "new_CSS_property_value";

To Next Beginning JavaScript Lesson

Back To Beginning JavaScript Index