link和@import的区别
前言
页面引用css样式的方式大致有四种:
- 内联样式
- 内嵌样式 (即行内样式)
- 外链样式
- 导入样式
link和import都可以对css样式进行外部引用,但它们还是有区别的。
link语法:1<link rel="stylesheet" type="text/css" href="css文件" media="all">
这个代码中有一个media,是用来制作响应式网页的,media=“all” 是用于所有设备, media=“screen” 用于电脑屏幕,平板电脑、智能手机场景。
@import语法: 123<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不支持。