CSS的三种引入方式：外部样式、内部样式和行内样式
CSS有三种引入方式：外部样式、内部样式和行内样式。
外部样式：
通过
<link>标签引入外部的 CSS 文件。创建一个单独的 CSS 文件，然后在 HTML 文件中通过<link>标签引入。
HTML 文件：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>外部样式</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="example">这是一个外部样式的例子。</div>
</body>
</html>CSS 文件（style.css）：
.example {
color: blue;
font-size: 20px;
}内部样式：
通过
<style>标签在 HTML 文件内部定义 CSS 代码。
HTML 文件：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>内部样式</title>
<style>
.example {
color: green;
font-size: 20px;
}
</style>
</head>
<body>
<div class="example">这是一个内部样式的例子。</div>
</body>
</html>行内样式：
通过 HTML 元素的
style属性直接定义 CSS 代码。
HTML 文件：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>行内样式</title>
</head>
<body>
<div style="color: red; font-size: 20px;" class="example">这是一个行内样式的例子。</div>
</body>
</html>以上三种方式是 CSS 的基础使用方式，实际项目中会根据需要选择合适的方式来引入 CSS。
评论已关闭