css3中link与@import的区别

媒体查询的引入方式1

@import：指定导入的外部样式表及目标媒体

语法：@import url(index.css) screen and (min-width:xxx px) and(max-width:xxx px);

媒体查询引入方式2

style标签内

<style media="(min-width:xxx px) and (max-width:xxx px)">

box{

background-color:red;

}

</style>

媒体查询引入方式3

使用link，有条件的引入外部样式表

<link rel="stylesheet" href="index.css" media="(min-width:xxx px) and (max-width:xxx px)">

link和@import的区别

功能：link可以定义rss、rel等作用；import只能加载css

加载情况：link页面会同步加载所引入的css；import所引用的css会等到页面加载完才被加载

js动态引入：link可以动态引入；import不可以动态引入