Css Rules Cascade

there are two or more rule that is apply to the same elements in web page, it's important to understand what is use of css

LAST RULE:-

the two selectors are define, Here you can see the second i selector takes over the first

SPECIFICITY:-

one selector is more specific than to the other, the more specific rules will be takes over more general one. In this example:- h1 is more special than * p b is more special than p p#intro is more special than p

IMPORTANT:-

You can add !important after the any value to show that is it should be considered more important than others rule that apply to the same element in the webpages.

<style>
* {
     font-family: Arial, Verdana, sans-serif;
}
h1 {
     font-family: "Courier New", monospace;
 }
i {
     color: green;
}
i  {
     color: red;
}
b  {
     color: pink;
}
p b {
    color: blue !important;
}
p b {
    color: violet;
}
p#intro {
    font-size: 100%;
}
p  {
 font-size: 75%;
}
</style>
 <h1>Code family</h1>
<p id="intro">There are <i>dozens</i> Code family
<b>Code family</b> Code family.</p>
<p>They are usually described as early, second early
and Code family.</p>