A brief discussion on the difference between link and @import

一个新手
Release: 2017-09-25 10:15:45
Original
1560 people have browsed it

In css operations, there are two ways to introduce CSS from the outside, link and @import.

The following are the differences and conclusions between the two methods:

Difference:

1. Loading sequence
When loading the page, link tag introduced CSS files are loaded simultaneously; @import introduced The CSS file will be loaded after the page has finished loading.

2. Compatibility
link tag is HTML element, no compatibility issues@import Yes The syntax is only available in CSS2.1, so it can only be recognized by IE5+.

3. link is a label that can be loaded CSS files, you can also define RSS, rel connection attributes, etc. ; @import is a grammatical rule, only styles can be imported surface.

4. Whether DOM operations can be used to insert and modify styles.
You can operate the DOM through JS to insert the link tag to change the style, but @import cannot use the DOM method to insert the style.

Conclusion:

It is strongly recommended to use the link tag and use the @import tag with caution.

This can avoid @import from causing confusion in the download order of resource files and too many HTTP requests.

The above is the detailed content of A brief discussion on the difference between link and @import. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!