css样式的四种引入方式
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<!--css样式的四种引入方式
1.内嵌式
2.内部样式（行内式）
3.链接式
4.导入式
-->
</head>
<body>
<!-- 1.内嵌式-->
<div style="font-size:40px">
div01
</div>
<div>
div02
</div>
</body>
</html>
----------------------------------------------------------------------------------------------------------------------------------------------------------------------
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
div{
font-size:50px;
color:cornflowerblue;
}
</style>
</head>
<body>
<!--2.内部样式（行内式）-->
<div>
学好css，走遍天下！
</div>
<p>
学好css，走遍天下！
</p>
</body>
</html>
--------------------------------------------------------------------------------------
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<link href="css/Demo03.css"rel="stylesheet"type="text/css">
</head>
<!--链接式-->
<body>
<p>
小朋友,你要学习css
</p>
<h1>
小朋友,你要学习css
</h1>
<div>
小朋友,你要学习css
</div>
</body>
</html>
Demo03.css
h1{
font-size:40px;
color:navajowhite;
}
------------------------------------------------------------------------------------------------------------
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
@import url("css/Demo03.css");
</style>
</head>
<body>
<!--导入式-->
<h1>
我是导入式
</h1>
</body>
</html>
浙公网安备 33010602011771号