关于CSS 的加载方式
2018-04-05 本文已影响0人
虾丸biu
外部样式
当样式需要应用于很多页面时，外部样式表将是理想的选择。在使用外部样式表的情况下，你可以通过改变一个文件来改变整个站点的外观。
- 使用 <link> 标签链接到样式表。如：
<head>
<link rel="stylesheet" href="style.css">
</head>
N.引入style.css时，style.css必须在当前目录下，如果不在当前目录下，则要把路径标明出来。如：
<head>
<link rel="stylesheet" href="CSS/style.css">
</head>
内部样式
当单个文档需要特殊的样式时，就应该使用内部样式表。
- 可以使用 <style> 标签在文档头部定义内部样式表。如：
<style>
p{
font-size: 50px;
}
</style>
- 当需要.html中引入一个.css的文件时。如：
<style>
@import url(style.css);
p{
font-size: 50px;
}
</style>
N.@impor还可以把两个.css的文件连接到一起，在其中一个.css中用@impor引入另一个.css文件。如：
#以下写法都可以
@import url(style2.css);
@import url("style2.css");
@import url('style2.css');
@import "style2.css";
@import 'style2.css';
内联样式(不推荐)
由于要将表现和内容混杂在一起，内联样式会损失掉样式表的许多优势。请慎用这种方法，例如当样式仅需要在一个元素上应用一次时。
<p style="background: orange; font-size: 24px">
Hello CSS
</p>
N.多重样式优先级：内联样式 > 内部样式 >外部样式 > 浏览器默认样式
