DHTML - CSS
JavaScript and the HTML DOM can be used to change the style of any HTML element.
Change Style of Current HTML Element
To change the style of the current HTML element, use the statement:
this.style.property=new style
Example
<html>
<body>
<h1 id="header" onclick="this.style.color='red'">Click Me!</h1>
</body>
</html> |
|
Change Style of a Specific HTML Element
To change the style of a specific HTML element, use the statement:
document.getElementById(element_id).style.property=new style
Example
<html>
<body>
<h1 id="h1" onclick="document.getElementById('h1').style.color='red'">Click Me!</h1>
</body>
</html> |
|
 |
Try it Yourself - Examples |
Mouse Events
Change the color of an element when the cursor moves over it.
Visibility
How to make an element invisible. Do you want the element to show or not?
More About the Style Object and CSS
For all style properties, look at our complete
HTML DOM Style Object Reference.
To learn more about CSS, find the tutorial on our
Home Page.

Whether you're new to XML or already an advanced user,
the user-friendly views and powerful entry helpers,
wizards, and debuggers in XMLSpy are designed to meet your XML
and Web development needs from start to finish.
- XML editor
- Graphical XML Schema / DTD editors
- XSLT 1.0/2.0 editor, debugger, profiler
- XQuery editor, debugger, profiler
- XBRL validator & taxonomy editor
- Support for Office Open XML (OOXML)
- Graphical WSDL editor & SOAP debugger
- Java, C#, C++ code generation
- And much more!
Download a free trial today!
|
|
|
|