Question

175

How to change/remove CSS classes definitions at runtime?

rated 0 times [ 178] [ 3] / answers: 1 / hits: 36377 / 15 Years ago, wed, april 8, 2009, 12:00:00

I know it is possible to add new CSS classes definitions at runtime through JavaScript. But...

How to change/remove CSS classes definitions at runtime?

For instance, supose a I have the class below:

<style>

.menu { font-size: 12px; }

</style>

What I want is, at runtime, change the font-size rule of the .menu class, so that every element in the page who uses this class will be affected.

And, I also want to know how to remove the .menu class definition.

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

taylert

Add To Favorites

Follow

Total Points: 627

Total Questions: 91

Total Answers: 108

Location: Mayotte

Member since Mon, Sep 12, 2022

2 Years ago

taylert questions

1 How to format date in v-Calendar?

Tue, Jul 28, 20, 00:00, 4 Years ago

1 Check if at least two elements in an array are greater than zero - JavaScript/Typescript

Mon, Feb 17, 20, 00:00, 4 Years ago

1 How do a date range validation with vue/Quasar

Tue, Dec 10, 19, 00:00, 5 Years ago

1 JavaScript: When to use a Class vs. a prototype?

Fri, Sep 13, 19, 00:00, 5 Years ago

1 Is there a generic way to set state in React Hooks? How to manage multiple states?

Tue, Jul 9, 19, 00:00, 5 Years ago

View All

answered 15 Years ago rebekahalysah · Accepted Answer

It's not difficult to change CSS rules at runtime, but apparently it is difficult to find the rule you want. PPK has a quick tour of this on quirksmode.org.

You'll want to use document.styleSheets[i].cssRules which is an array you need to parse through to find the one you want, and then rule.style.setProperty('font-size','10px',null);