Nearby lessons

7 of 14

JavaScript HTML DOM – Changing CSS

📌 What is DOM CSS Manipulation?

JavaScript can be used to change the appearance (CSS styles) of HTML elements. You can apply styles directly or trigger style changes through events like a button click.

🎨 Changing HTML Style

Using the style property in JavaScript, you can change the CSS of any HTML element such as color, background, font size, etc.

Syntax: element.style.property = "value";

Example02
🧩Code Cell
Loading Editor...
✏️ You can edit this code — click Run to refresh the preview.
Output

🖱️ Using Events to Change CSS

JavaScript can change styles when a specific event occurs, like when the user clicks, hovers, or focuses on an element.

This makes your website interactive and responsive to user actions.

Example03
🧩Code Cell
Loading Editor...
✏️ You can edit this code — click Run to refresh the preview.
Output

🧠 Test Your Knowledge

2 Questions
Progress: 0 / 2