一：内部引入（style标签置于head标签中）
<head>
<meta charset="UTF-8">
<title>内部引入</title>
<!--样式置于内部head标签中-->
<style>
div {
font-size: 20px;
color: red;
}
</style>
</head>
<body>
<div>
天若有情天亦老，看见哈特蒙一脚！01
</div>
<div>
天若有情天亦老，看见哈特蒙一脚！02
</div>
<div>
天若有情天亦老，看见哈特蒙一脚！03
</div>
<div>
天若有情天亦老，看见哈特蒙一脚！04
</div>
</body>
二：行内引入（置于某个DIV标签中）
<head>
<meta charset="UTF-8">
<title>行内引入</title>
<style>
div {
font-size: 20px;
color: red;
}
</style>
</head>
<body>
<div>
天若有情天亦老，看见哈特蒙一脚！01
</div>
<div>
天若有情天亦老，看见哈特蒙一脚！02
</div>
<div>
天若有情天亦老，看见哈特蒙一脚！03
</div>
<!--标签置于行内-->
<div style="font-size: 10px;color: deeppink;">
天若有情天亦老，看见哈特蒙一脚！04
</div>
</body>
三：外部引入（样式置于外部文件，通过Link引入样式）
<head>
<meta charset="UTF-8">
<title>外部引入</title>
<!--通过link标签,引入样式-->
<link rel="stylesheet" type="text/css" href="style.css"/>
</head>
<body>
<div>
天若有情天亦老，看见哈特蒙一脚！01
</div>
<div>
天若有情天亦老，看见哈特蒙一脚！02
</div>
<div>
天若有情天亦老，看见哈特蒙一脚！03
</div>
<div>
天若有情天亦老，看见哈特蒙一脚！04
</div>
</body>