Shulou(Shulou.com)06/01 Report--

Editor to share with you what are the ways to quote CSS in HTML, I believe most people do not know much about it, so share this article for your reference, I hope you can learn a lot after reading this article, let's go to know it!

In HTML, the main methods of introducing CSS are inline type, embedded type, imported type and linked type.

Inline style: setting the CSS style in the style attribute of the tag, which essentially does not reflect the advantages of CSS, so it is not recommended to use

Example:

TextDemo

ThisisalineofText.

Embedded: embedded will centralize the settings of various elements in the page between and, for a single web page, this method is very convenient. But for a site that contains a lot of pages, if each page is embedded to set its own style, it loses the great advantages of CSS, so a site usually writes a separate CSS stylesheet file, using one of the following two ways, into the HTML document.

Example:

TextDemo

H2 {

Color:white

Background-color:boue

}

ThisisalineofText.

ThisisanotherlineofText.

Introduction type and link type: the purpose of introduction type and link type is to introduce a separate CSS file into the HTML file, and there is a corresponding difference between them.

In fact, the biggest difference between the two is that linking uses HTML tags to bring in external CSS files, while imported ones use CSS's rules to introduce external CSS files. So their grammar is also different.

If you use chaining, you need to bring in an external CSS file using the following statement.

If you use an introduction, you need to use the following statement.

@ import "mystyle.css"

In addition, the display effect of the two methods is also slightly different. When using the link method, the CSS file is loaded before the main part of the device page, so that the displayed web page has the effect of style from the beginning, while when using imported type, the CSS file will be loaded after the whole page has been loaded. For some browsers, in some cases, if the size of the web page file is relatively large, the unstyled page will appear first. The effect of the style setting appears after a flash. From the viewer's point of view, this is a flaw in the use of introduction. For some larger sites, for ease of maintenance, you may want to categorize all CSS styles into several CSS files, so that if you use a linked introduction, you need to import several statements into the CSS file respectively. If you want to adjust the classification of CSS files, you need to adjust the HTML files as well. This is a defect for maintenance work. If you use import, you can import only one overall CSS file, and then import other independent CSS files in this file; linked type does not have this feature.

So one of the suggestions for you here is that if you need to introduce a CSS file, use the link method; if you need to introduce multiple CSS files, first use the link method to introduce a "directory" CSS file, and then use import to introduce other CSS files in this "directory" CSS file.

If you want to dynamically decide which CSS file to import through JavaScript, you must use linking to do so.

The above is all the content of this article entitled "what are the ways to quote CSS in HTML". Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.