What are the types of css styles? css style code insertion forms can be basically divided into the following three types: inline, embedded and external. These three styles have priorities. Their priority is: inline > Embedded> External style, let’s take a look at the specific content and code of the three CSS style types.
Note: Embedded>External style has a prerequisite: the position of the embedded CSS style must be behind the external style. For example, in the right code editor, the code is in front of the code (actually This is also written during development). Interested friends can try it, reverse their order, and see if their priorities change.
In fact, in general, it is the proximity principle (the closer to the element being set, the higher the priority).
But note that the priority summarized above has a premise: the css styles in inline, embedded, and external style sheets have the same weight.
1. css inline style sheet
css style sheet is to write css code directly in the existing HTML tag, such as the following code:
<p style="color:red">这里文字是红色。</p>
Be careful to write it in the start tag of the element. The following way of writing is wrong:
<p>这里文字是红色。</p style="color:red">
And the css style code must be written in double quotes. If there are multiple css style codes Settings can be written together, separated by semicolons. The following code:
<p style="color:red；font-size:12px">这里文字是红色。</p>
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>认识html标签</title>
<style type="text/css">
span{
color:red;
}
</style>
</head>
<body>
<p>php中文网，<span style="color:blue">一级棒的网站</span>、教程,手册,视频,mysql,免费php在线学习平台；<span>资源免费</span>，内容专业、<span>讲师专业</span>。专注让你成为php高手！</p>
</body>
</html>2, css embedded style sheet
Embedded css style means that you can write the css style code in tags. For example, the following code sets the text in the three tags to red:
<style type="text/css">
span{
color:red;
}
</style>Embedded css styles must be written between , and are generally embedded The css style is written between
. Such as the code in the editor on the right.<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>嵌入式css样式</title>
<style type="text/css">
span{
color:blue;
}
</style>
</head>
<body>
<p>php中文网，<span style="color:blue">一级棒的网站</span>、教程,手册,视频,mysql,免费php在线学习平台；<span>资源免费</span>，内容专业、<span>讲师专业</span>。专注让你成为php高手！</p>
</html>3. css external style sheet
External css style (also called external style) is to write the css code in a separate external file. This css style file has the extension name of ".css". Use the tag within the