Menu
Possible Duplicate:
How to change/remove CSS classes definitions at runtime?
I have a HTML page which uses external css file .I want to change css rules of external file using javascript at runtime.
myHtml.html
<html>
<head>
<link rel="stylesheet" href="myCSS.css" type="text/css">
<script type="text/ecmascript" src="myJS.js" />
</head>
<body>
<p> change css style color for this element using javascript </p>
</body>
</html>
myCSS.css
.p{ color:blue}
myJS.js
var ss = document.styleSheets[0]
var firstRule = ss.rules[0] // null
I want to perform the operation :
firstRule.style.color = "red" ;
781
You can override external css properties by using internal css. It could also be achieved in three different ways :
1) declare your css properties in the page itself for example as per your code include "style" tags and write properties in between
< html>
< head>
< link rel="stylesheet" href="myCSS.css" type="text/css">
< script type="text/ecmascript" src="myJS.js" />
<style type="text/css">
........................
.........................
</style>
< /head>
< p > change css style color for this element using javascript
< /p>
< /html>
2) Using inline css
< p style="font-color:red;"> change css style color for this element using javascript
< /p>
3) Using javascript : It's just another way or you can say indirect way to achieve implement internal css implementation. See first answer given by @Misam
184
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
