The cascade in Css

It’s possible to define the rule for a given element multiple times: you can do so in the
same style sheet, and several style sheets can be attached to an HTML document. On top
of that, you may be using embedded style sheets and inline styles. The cascade is a way of
dealing with conflicts, and its simple rule is this:
In the following example, the second font-size setting for paragraphs takes precedence
because it’s closest to paragraphs in the HTML:p {
font-size: 1.1em;
}
p {
font-size: 1.2em;
}
Subsequently, paragraphs on pages the preceding rule is attached to are rendered at
1.2em. If a similar rule were placed as an embedded style sheet below the imported/linked
style sheet, that rule would take precedence, and if one were applied as an inline style
(directly in the relevant element), then that would take precedence over all others.
CSS uses the concept of inheritance. A document’s HTML elements form a strict hierarchy,
beginning with html, and then branching into head and body, each of which has numerous
descendant elements (such as title and meta for head, and p and img for body). When a
style is applied to an element, its descendants—those elements nested within it—often
take on CSS property values, unless a more specific style has been applied. However, not
all CSS style properties are inherited. See the CSS reference section of this book for more
details.