How do I override class background color?
Tried !important but not working, the text is still yellow.
<!DOCTYPE html>
<html>
<head>
<style>
.myclass {
background-color: yellow ;
}
</style>
</head>
<body>
<p class="myclass" background-color="red !important">This is some text in a paragraph.</p>
</body>
</html>
if you want use inline styles (not good), you should use style attribute on html elements and in any way of using css you should use colon : instead of = for giving value to properties, try this snippet:
<!DOCTYPE html>
<html>
<head>
<style>
.myclass {
background-color: yellow;
}
</style>
</head>
<body>
<p class="myclass" style="background-color:red !important;">This is some text in a paragraph.</p>
</body>
</html>
You need to put inline css in the style attribute like so:
<!DOCTYPE html>
<html>
<head>
<style>
.myclass {
background-color: yellow ;
}
</style>
</head>
<body>
<p class="myclass" style="background-color: red !important;">This is some text in a paragraph.</p>
</body>
</html>
You need to mention style.
<p class="myclass" style="background-color:red !important;">This is some text in a paragraph.</p>