How to import css files

Methods to introduce css files: 1. Inline method introduction, set the CSS style in the style attribute of the tag; 2. Embedded method introduction, write the CSS style in the style tag of the web page; 3 , Use link to reference external CSS files; 4. Use @import to reference external CSS files.

The operating environment of this article: Windows7 system, HTML5&&CSS3 version, Dell G3 computer.

How to import css files? Several methods of introducing CSS files into HTML

Generally speaking, there are four types:

1. Inline style: also called inline style, set in the style attribute of the mark Define CSS styles. This method does not reflect the advantages of CSS;

2. Embedded: Concentrate the CSS styles on the tag pair of the web page's Tags are aligned;

3. Link type: The fourth import type is called external type or external link type, use link to refer to external CSS files;

4. Import type: use @import refers to external CSS files;

---------------------------------------- ----------------A

Inline style is the easiest and most comfortable way to start writing, but this way of writing does not reflect the advantages of CSS at all. As follows:

I write inline

If there are many tags on a page, this writing method will look bad and cumbersome, and it will be too repetitive, so it is not recommended!

-------------------------------------------------- ---------B

Embedded is also a good choice if there are relatively few pages, but if there are many pages corresponding to a project, this will undoubtedly be a bit disastrous. You need to modify the style. It may be a large number of similar pages

, but they have to be modified one by one, as follows:

<span style="font-size:14px;"><style type="text/css"></span>
<span style="font-size:14px;">#demo{
position:absoulte;
left: 20px;
top:50px;
width:300px;
height: 50px;
border: solid 1px red;
padding-left: 20px;
color:gray;
font-size: 20px;
line-height: 50px;
text-align: center;</span>
<span style="font-size:14px;">}
</style></span>

This writing method avoids the "no style" phenomenon of the page to a certain extent. Render the page after the css is loaded...

--------------------------------- --------------------CD

External css style is to write the css code in a separate external file. This css style file ends with ". css" as the extension, use the tag within the tag (not within the , but in css files, you can directly @import

is used to add the path. This brings up a point: for projects with many style files, we can choose to render the main styles first, and some secondary ones. Import it in the css file

, which can also alleviate the pressure on the server to a certain extent. Although the file is not large, it is still good to optimize it. In essence, there is not much difference between these two external introduction methods, but sometimes for the convenience of editing the style of the site in the project, the link method is often used.

Of course there are some introduction methods that use XML as editing requirements, but they are not commonly used....

Recommended learning: "

css Video Tutorial

"

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

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