一、内联样式
在元素的style属性中直接书写的样式
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML</title>
</head>
<body>
<!--内联样式-->
<h1 style="color:red">内联样式</h1>
</body>
</html>
二、内部样式
在style标签内书写的样式
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML</title>
<style>
<!--内部样式-->
h2 {
color: blue;
}
</style>
</head>
<body>
<h2>内部样式</h2>
</body>
</html>
三、外部样式
写在单独的css文件当中
my.css
p {
color: yellow;
}
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML</title>
<!--外部样式-->
<link rel="stylesheet" href="my.css"/>
</head>
<body>
<p>外部样式</p>
</body>
</html>