CSS Style Sheet Classification summary

1, external style sheet

An external style sheet is an ideal choice when the style needs to be applied to many pages. With an external style sheet, you can change the appearance of the entire site by changing a file. Each page uses <link> tags to link to the style sheet. <link> tags at the head of (document):

The browser reads the style declaration from the file mystyle.css and formats the document according to it.
External style sheets can be edited in any text editor. The file cannot contain any HTML tags. Style sheets should be saved with a. css extension. Here is an example of a style sheet file:
hr {Color:sienna;} p {margin-left:20px;} Body {Background-i}
2, internal style sheet
An internal style sheet should be used when a particular style is required for a single document. You can use the <style> tag to define an internal style sheet at the head of the document, just like this:



3, inline style
Inline styles lose many of the benefits of stylesheets because of the mix of performance and content.
Use this method with caution , such as when the style only needs to be applied once on one element.
To use inline styles, you need to use style properties within the relevant tags. The Style property can contain any CSS properties.
This example shows how to change the color and left margin of a paragraph:
<p style= "Color:sienna; margin-left:20px ">
This is a paragraph
</p>

4, multiple styles

If some properties are defined by the same selector in a different style sheet, the property values are inherited from the more specific style sheet.
For example, an external style sheet has three properties for the H3 selector:
h3 {color:red;  Text-align:left;  font-size:8pt; }
An internal style sheet has two properties for the H3 selector:
h3 {text-align:right;  font-size:20pt; }
If this page with an internal stylesheet is connected to an external style sheet, the H3 gets the following style:
color:red; Text-align:right; font-size:20pt;
That is, the color attribute will be inherited from the external style sheet, and the text arrangement (text-alignment) and font size (font-size) will be superseded by the rules in the inner style sheet.

This article is from the "Crazy_sir" blog, make sure to keep this source http://douya.blog.51cto.com/6173221/1840835
CSS Style Sheet Classification summary