May 04, 2021 CSS
We all know that HTML and CSS are two different languages, but they can work for a Web page at the same time, webPage , content (html), performance (css) , and behavior (javascript). T herefore, CSS needs to be introduced into HTML to work with. T o display the desired CSS style sheet effect in your browser, you need to have the browser recognize and call CSS correctly. W hen a browser reads a style sheet, it reads in a text format, and when the CSS style sheet is placed in a different place, the scope of action is different. In HTML, CSS is introduced in four main ways: in-line, inline, imported, and linked.
(1) In-line
<p style=”color:red”>网页中css的导入方式</p>
That is, set the CSS style in the marked style properties, which does not essentially reflect the advantages of CSS and is therefore not recommended.
(2) Embedded
<style type=”text/css”>
p{ color:red }
</style>
(3) Imported
<! - Import External Style: Import an external style sheet between the <style> </ style> tag of the internal style sheet, use @Import when importing.->
<style type="text/css">
@import "jisuan.css";
</style>
(4) Linked
<link href="jisuan.css" rel=”stylesheet” type=”text/css” />
Linking can be said to be the dominant method of introduction now. L
ike IE and browser. T
his is also the most reflected CSS characteristics of the method, the most reflects the DIV- CSS content and display separation of the idea, but also the most easily modified maintenance, the code also looks the most beautiful one.
If you want javascript to dynamically decide which css file to bring in, you must use connectivity to implement it. M
ost websites still prefer to use links to reference external CSS.
2, linked: will load the main part of the page before loading CSS files, so that the display of the web page from the beginning is with a style effect.
For some of the bigger sites, for ease of maintenance, you might want to put all the CSS style categories into several CSS files, so that if you use connected introduction, you'll need several statements to import the CSS files separately. I
f you want to classify CSS files, you need to adjust the HTML files at the same time, which is a flaw in maintenance work, if you use imported, you can introduce only one total CSS file, in this file and then import other independent CSS files;
Therefore, the suggestion is: if you only need to introduce one CSS file, then use linking, if you need to introduce multiple CSS files, first introduce a "directory" CSS file by linking, this "directory" CSS file and then use import to introduce other CSS files.
The definition @import Quote
Specify the imported external style sheet and target device type. I
n fact, the fundamental difference between link and @import is that link is a label for HTML, and @import is a label for CSS, and link can have other functions in addition to calling CSS, such as declaring page link properties, declaring directories, rss, and so on, while @import can only call CSS. I
f CSS is referenced from the outside alone, their role is basically the same, except that the boss above is different.