我的回答

从属

• link是html的标签
• @import是css提供的

加载顺序

• link引入的css会同时加载
• @import引入的css会在页面加载完成后再加载

兼容性

• link是html的标签, 不存在兼容性问题
• import是css2.1出现的, 要IE5.1+才能支持

DOM可控性

• link可以使用js操作dom来进行操作
• import不能使用js操作dom来操作

权重

• link标签权重大于import

参考答案

• 1.从属关系区别：

  link是属于html标签，而@import是css提供的

• 2.加载顺序区别：

  页面被加载时，link会同时加载，而@import引用的css会等到页面被加载完再加载

• 3.兼容性区别：

  import只在IE5以上才能识别，而link是html标签，无兼容问题

• 4.dom可操作性的区别：

  可以通过js操作dom，插入link标签来改变样式；由于dom方法是基于文档的，无法使用@import的方式插入样式

• 5.权重区别：

  在.css文件用import引入时，如果已经存在相同样式，@import引入的这个样式将被该css文件本身的样式层叠掉，表现出link方式的样式权重高于@import的权重这样的直观效果 简而言之：link和@import，谁写在后面，谁的样式就被应用，后面的样式覆盖前面的样式