Home >Web Front-end >CSS Tutorial >How to introduce css
How to introduce css
- coldplay.xixiOriginal
- 2021-04-16 16:36:286602browse
How to introduce css: 1. Add the style to the style attribute of the tag; 2. Add it to the style tag and add it to the head tag; 3. Write the css style in the file with the extension [.css] file, then import the style, and import it inside the head tag.
The operating environment of this tutorial: windows7 system, css3 version, DELL G3 computer.
Methods to introduce css:
1. Inline style (interline style): Add style to the style attribute of the tag:
<!DOCTYPE>
<html>
<head>
<meta charset="utf-8" />
<title>行内样式</title>
</head>
<body>
<!--使用行内样式引入CSS-->
<h1 style="color:red;">HTML中文网</h1>
<p style="color:red;font-size:30px;">HTML中文网</p>
</body>
</html>2 , Embedded style sheet (internal style sheet): Add it in the style tag (add it inside the head tag)
<!DOCTYPE>
<html>
<head>
<meta charset="utf-8" />
<title>内部样式表</title>
<!--使用内部样式表引入CSS-->
<style type="text/css">
div{
background: green;
}
</style>
</head>
<body>
<div>我是DIV</div>
</body>
</html>3. External style sheet: Write the css style in a file with the extension .css. Then import the style and import it (inside the head tag)
<!DOCTYPE>
<html>
<head>
<meta charset="utf-8" />
<title>外部样式表</title>
<!--链接式:推荐使用-->
<link rel="stylesheet" type="text/css" href="css/style.css" />
</style>
</head>
<body>
<ul>
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
</ul>
</html>Recommended related tutorials: CSS video tutorial
The above is the detailed content of How to introduce css. For more information, please follow other related articles on the PHP Chinese website!