一、四种引入样式方法及使用
1.行内样式:在标签内,结合style
<h1 style="color: red;">我是行内样式</h1>
2.内嵌样式:在head标签里嵌套style标签
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>4.CSS样式引入方式及使用</title>
<style>
h2 {
color: blue;
}
</style>
</head>
<body>
<h2>我是内嵌样式,我在在head标签里嵌套style标签</h2>
</body>
3.外联样式:在.css写样式,通过link标签引入
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>4.CSS样式引入方式及使用</title>
<link rel="stylesheet" href="外联引入.css">
<style>
</style>
</head>
<body>
<h3>我是外联样式</h3>
</body>
4.导入样式:在style标签内
使用@import()
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>4.CSS样式引入方式及使用</title>
<style>
@import url(外联引入.css);
</style>
</head>
<body>
<h4>我是导入样式</h4>
</body>
二、四种引入方式的优先级
1.就近原则
2.理论上:行内>内嵌>链接>导入
3.实际上:行内样式优先级最高,内嵌、链接、导入在同一个文件头部,谁离相应的代码近,谁的优先级高。