A Web page may link to an external style sheet, use an internal style, and also use inline styles. When multiple style rules apply to the same content the Web browser uses a set of rules to resolve the conflict based on a cascade order. The rules are complex but are based on easily-understood principles of specificity and proximity. The more specifically a rule applies to an element, the more weight it is given in resolving any conflicts. An id selector, for example, is more specific than a class selector, which in turn is more specific than an element selector. Proximity matters as well. An inline style will override an internal style, which in turn will override a rule found in an external style sheet. To force a given rule to take precedence you may use the !important value as part of the declaration.
h1 { color: maroon !important;}
CSS recognizes three types of elements. Block-level elements include paragraphs, heading, lists, tables, and divs. Block-level elements always begin on a new line. Inline elements include anchors (<a></a>), spans, form elements, and images. Inline elements exist in the natural flow of the document without forced line breaks. Inline elements may contain other inline elements but may not contain block-level elements. List-item elements are the <li></li> elements found in unordered and ordered lists. List-item elements have markers associated with them such as bullets, numbers, or letters.
An invisible element box surrounds every element in CSS. Each element box has an outer edge, margin, border, padding, and inner edge that contain the width and height of the content