The differences between css external linking and inline embedding are: 1. The writing methods of the three styles are different; 2. The three methods have different weight priorities in actual use. The order from high to low is "Embedding> ;Inline>Outline".
#The operating environment of this tutorial: Windows 7 system, Dell G3 computer, CSS3 version.
What is the difference between external, inline and embedded css?
First of all, from a functional point of view, the functions of these three implementations are the same, and they can all achieve the typesetting and modification of content.
However, in terms of writing, they are different. Let’s distinguish them one by one:
1, inline style writing
<p style="color:red;"></p>
2, external style writing
Write a separate file with css extension, and then use the tag in
to link the css style to html. For example:<link href="你的css文件地址" rel="stylesheet" type="text/css"></link>
3, nested style writing
can be understood as nesting. Now write the required element tags in the
text, such as span, and then write a separate css style in in . For example:
<head>
<style type="text/css">
span{color:re;}
</style>
</head>Differences in priorities (Recommended: css video tutorial)
In actual use of the three methods, weight takes priority From high to low: embedded>inline>outline. More general styles are suitable to be isolated and used externally to improve reusability and reduce the coupling between styles and content; styles with few independent elements can be more convenient to use embedded.
The above is the detailed content of The difference between css external linking and inline embedding. For more information, please follow other related articles on the PHP Chinese website!
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
