1.外部引入
a.引入CSS文件 使用link标签 href写文件路径;
内容与表现分离利于加载
<link rel="stylesheet" type="text/css" href="antzone.css" />
b.一个CSS引入另一个CSS中
使用@import引用外部CSS文件
<style type="text/css">
@import url("css文件路径");
</style>
link和@import区别
1.link属于HTML标签,而@import是css提供的;
2.页面加载时,link会同时被加载,而@import引用的css会等页面被加载完成再加载;
3.@import只在IE5以上才能识别,而link是HTML标签无兼容性问题;
4.link权重高于@import
2.嵌入式引入
<!DOCTYPE>
<html>
<head>
<meta charset="utf-8" />
<title>嵌入式引入</title>
<style type="text/css">
p{
color: blue;
}
</style>
</head>
<body>
<p>我是p段落</p>
</html>
4.行内样式
<p style="color: red;">我是p段落</p>
引入优先级
行内样式>嵌入式>外部样式(就近原则,位置靠下的优先级更高)