css外部样式
使用单独的 .CSS 文件定义,然后在页面中使用 link标签 或 @import指令 引入
使用 link标签 链接外部样式文件
<link rel="stylesheet" type="text/css" href="CSS样式文件的路径">
1
提示:type属性可以省略
@import 指令 导入外部样式文件
<style>
@import "CSS样式文件路径";
@import url(CSS样式文件路径);
</style>
1
2
3
4
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
/* 1.内部样式 */
p{
color:blue;
}
</style>
<!-- link链接外部样式文件 -->
<!-- <link rel="stylesheet" type="text/css" href="style/hello.css"> -->
<!-- 3.import导入外部样式文件 -->
<style>
/* @import "style/hello.css" */
@import url(style/hello.css);
</style>
</head>
<body>
<p>welcome to CSS!</p>
<p>欢迎来到CSS课堂!</p>
<hr>
<h2 style="color:red;">WEB前段工程师</h2>
<h2>JAVA开发工程师</h2>
<hr>
<div>嘿嘿</div>
<div>哈哈</div>
</body>
</html>