How to reference css files in html

The main methods of referencing CSS in HTML are:

1, inline style

2, inline style

3, Link style

4. Import style

Inline style

refers to the value of the Style element written in the tag

<p style="color: #FF0000;">行内样式</p>

Recommended Tutorial: html tutorial

embedded

is written in the head tag of the HTML page.

<style type="text/css">
            XXXXXXXX        
</style>

Linked style

is also performed inside the head tag, but requires a dedicated CSS file to be written externally.

<link rel="stylesheet" href="css/Demo.css" />

Import style

is also in the head tag.

<style type="text/css">
            @import url("css/Demo.css");        
</style>

The difference between import and link is: it is loaded once when importing, while link is loaded when its style is needed, so the performance of link type is higher. Especially when loading for the first time.

Priority:

Inline style
Linked style
Embedded style
Imported style (link after import)
OR
Inline style Style
Embedded
Imported

For more programming-related content, please pay attention to the Programming Introduction column on the php Chinese website!

The above is the detailed content of How to reference css files in html. For more information, please follow other related articles on the PHP Chinese website!