css样式的三种引⽤⽅式
CSS的三种引⽤⽅式:
1.内联样式(⾏间样式)：直接在标签内部通过使⽤style属性添加CSS样式　
<p >这是⼀个段落</p>
2.内部样式：在<head>标签⾥⾯通过使⽤<style>标签来引进CSS样式
<head>
<style>
p{
corlor:red;
font-size:12px;
}
</head>
3.外部样式：先在外部新建⼀个外部样式表，然后在<head>标签⾥⾯通过<link>标签进⾏关联
<head>
<link rel="stylesheet" type="text/css" href="base.css"/>
</head>
或者⽤@import引⼊
<style type="text/css" >
@import url("CSS⽂件");
</style>
link和@import的区别:
1.⽼祖宗的差别。link属于XHTML标签，⽽@import完全是CSS提供的⼀种⽅式。link 标签除了可以加
载CSS外，还可以做很多其它的事情，⽐如定义RSS，定义rel连接属性等，@import就只能加载CSS了。
2.加载顺序的差别。当⼀个页⾯被加载的时候（就是被浏览者浏览的时候），link引⽤的CSS会同时被加载，⽽@import引⽤的CSS会等到页⾯全部被下载完再被加载,⽹速慢时会影响视觉效果.
link确保并⾏下载css⽂件，@import是⼀个⼀个下载。在IE中，link会阻断@import延长加载时间，多个@import的使⽤还会打乱资源⽂件的下载顺序引发js问题。
textstyle3.兼容性的差别。由于@import是CSS2.1提出的所以⽼的浏览器不⽀持，@import只有在IE5以上的才能识别，⽽link标签⽆此问题。
4.使⽤DOM控制样式的区别.当使⽤javascript控制dom去改变样式的时候，只能使⽤ link标签，因为@import不是dom可以控制的。
使⽤link:　link可以选定要加载的媒体media。由于上述加载、兼容与IE的原因，普通站点应当尽量使⽤link　
使⽤@impo:⼤型门户⽹站（如淘宝）多个页⾯link同⼀个css⽂件会造成速度下降，@import可以在css中调⼊样式表，⽅便对css进⾏模块化管理。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。