!important rules are used to override specificity. : important « Style Basics « HTML / CSS






!important rules are used to override specificity.

  
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
                      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns='http://www.w3.org/1999/xhtml' xml:lang='en'>
    <head>
        <title>Specificity, !important</title>
<style type='text/css'>
body {
    font: 14px sans-serif;
}
span#precedence {
    background: lightyellow;
}
span {
    background: orange !important;
}
</style>


    </head>
    <body>
        <p>
            !important rules are used to override specificity.  
            <span id='precedence'>
                greater precedence than those without it.
            </span>
            It also
            <span style='background: lightblue'>
                has greater precedence than the (x)HTML style attribute.
            </span>
        </p>
    </body>
</html>

   
    
  








Related examples in the same category

1.!important rules are used to override specificity
2.!important syntax has greater precedence than the (x)HTML style attribute
3.Important Override
4.Specificity, !important
5.Specificity, !important is more important than the inline style