前言

页面引用css样式的方式大致有四种：

• 内联样式
• 内嵌样式 (即行内样式)
• 外链样式
• 导入样式
  link和import都可以对css样式进行外部引用，但它们还是有区别的。
  
  link语法：
  

  1	<link rel="stylesheet" type="text/css" href="css文件" media="all">

这个代码中有一个media，是用来制作响应式网页的，media=“all” 是用于所有设备， media=“screen” 用于电脑屏幕，平板电脑、智能手机场景。

@import语法：

1
2
3

<style type="text/css" media="screen">
@import url("css文件");
</style>

两者的区别

• link是XHTML标签，除了可以引用css样式外还可以定义RSS等事物，但@import是css标签，只能引用css样式。
• link在页面加载的同时加载，而@import是在页面内容加载完成之后加载的。
• link是XHTML标签，没有兼容问题，而@import是在css2.1提出来的，低版本的浏览器不支持。
• link支持使用javascript控制DOM去改变样式，@import不支持。

下一篇：javascript实现继承的几种方式