链接外部样式表
在<head>标签内，使用<link>标签将外部CSS文件链接到HTML文件。如下所示：
<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>属性rel规定文档与被链接文档之间的关系，type属性规定被链接文档的MIME类型，href属性指定被链接文档的URL。
在上述代码中，样式表文件名为“style.css”，保存在HTML文件所在目录中。
嵌入样式表
在<head>标签内，使用<style>标签将CSS样式直接嵌入到HTML文件中。如下所示：
<head>
<style>
body {
background-color: #f0f0f0;
}
h1 {
color: red;
}
</style>
</head>使用内联样式
在HTML标签内，使用style属性添加行内样式。如下所示：
<h1 style="color: red;">Hello world!</h1>示例代码：
HTML文件：
<!DOCTYPE html>
<html>
<head>
<title>HTML引用CSS示例</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<h1>欢迎来到HTML引用CSS示例</h1>
<p>这是一个段落</p>
<button class="myBtn">点击我</button>
</body>
</html>CSS文件：
body {
background-color: #f0f0f0;
}
h1 {
color: red;
}
.myBtn {
background-color: blue;
color: white;
padding: 10px;
border: none;
border-radius: 5px;
font-size: 16px;
}本站文章如无特殊说明，均为本站原创，如若转载，请注明出处：HTML如何引用CSS？ - Python技术站
微信扫一扫 
支付宝扫一扫 