CSS can be defined in HTML in the following ways: Embedding (embedded), Linking (referenced), Inline (Inline ), the following examples describe their features in detail. In HTML, CSS is often defined in the following three methods: Embedding (embedded), Linking (referenced), and Inline (Inline)
I. embedded
Use the HTML style element to define CSS styles in the document.
The Code is as follows:
Ii. inline
Each HTML element contains a style attribute that can be directly defined. This style can only be used for the content of this element. It does not work for another element with the same name.
The Code is as follows:
Inline Style
Iii. external references
External Reference refers to the dynamic reference of external CSS file definitions rather than CSS styles.
1. Use the Processing Instruction statement of the style sheet
Write an instruction processing statement about the style sheet at the beginning of the HTML document.
The Code is as follows:
Command statement
However, this command is only supported for html documents written in xml syntax. Most browsers are only valid when they are saved in xhtml or xml format, and JS cannot process such CSS, it is not recommended.
2. Run the @ import command.
Use the @ import command between style elements to import external css files
The Code is as follows:
Any @ import rule must appear before all rules. The parameter is the URL of a css file. In a css file, you can also use the @ import command to import another css file.
3. Use the link Element
The Code is as follows:
This is also the most common method.
4. Use the HTTP message header to link to the style sheet
You can use the link field of the HTTP message header to link an external style sheet.
The Code is as follows:
Link: ; Rel = stylesheet;
// Equivalent
Multiple links can be used in the HTTP header to link Multiple style sheets. The link in the HTTP header has a higher priority than the link in the HTML document.