内嵌式.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
h1 {
color: red;
}
</style>
</head>
<body>
<h1>我是一个主标题</h1>
<h1>我是一个主标题</h1>
<h1>我是一个主标题</h1>
</body>
</html>
外链式.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="css/css.css">
</head>
<body>
<h1>主标题</h1>
<h1>主标题</h1>
<h1>主标题</h1>
</body>
</html>
导入式.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
@import url(css/css.css);
</style>
</head>
<body>
<h1>主标题</h1>
<h1>主标题</h1>
<h1>主标题</h1>
<h1>主标题</h1>
</body>
</html>
行内式.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1 style="color: red;">我是一个主标题</h1>
<h1 style="color: red;">我是一个主标题</h1>
<h1 style="color: red;">我是一个主标题</h1>
</body>
</html>
CSS3的基本语法.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
h2 {
color: red;
/* 背景颜色 */
background-color: blue
}
}
p {
color: green;
/* 背景颜色 */
background-color: yellow
}
li { color: orange; background-color: red}
</style>
</head>
<body>
<h2>我是二级标题</h2>
<h2>我是二级标题</h2>
<h2>我是二级标题</h2>
<p>我是段落</p>
<p>我是段落</p>
<p>我是段落</p>
<ul>
<li>我是列表项</li>
<li>我是列表项</li>
<li>我是列表项</li>
</ul>
</body>
</html>
temp.html
<!DOCTYPE html>
<html lang="en">
<head>
<style>
p {
/* 设置文字字号 */
font-size: 40px;
}
</style>
</head>
<body>
<h2 style="color: red;">我是一个二级标题</h2>
<h2 class="spec">我是一个二级标题</h2>
<h2>我是一个二级标题</h2>
<p class="spec">我是一个段落</p>
<p class="spec">我是一个段落</p>
<p>我是一个段落</p>
</body>
</html>