There are several ways to introduce external css

There are two ways to introduce external css, namely: 1. Introduction through the "@import" instruction, the syntax "@import url (css file path);>"; 2. Introduction through the link tag, Syntax "".

The operating environment of this tutorial: Windows 7 system, CSS3&&HTML5 version, Dell G3 computer.

Two ways to introduce CSS

1. Import through the @import directive

@import directive is part of the CSS language. When using it, add this directive to a

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

2. Introduction through tags (the most common way)

<link type="text/css" href="style.css" rel="stylesheet" />

The difference between the two methods

• tag belongs to the html tag, and @import is a tag provided by css In this way, tags can not only introduce css, but also do other things, while @import can only introduce css

• The difference in loading order: when a page is browsed, the css introduced by link will be loaded synchronously, and the css referenced by @import will not be loaded until all other elements have been downloaded;

• Difference in compatibility: @import was only proposed in CSS2.1 , so it is only supported in IE5 and above, and lower version browsers do not support it, but tags do not have this problem;

• When using javascript to control the DOM to change the style, only tags can be used. Because @import is not controllable by DOM.

(Learning video sharing: css video tutorial)

The above is the detailed content of There are several ways to introduce external css. For more information, please follow other related articles on the PHP Chinese website!