2021-09-14 外部引入css的两种方式:link和@import的区别

区别

1.从属关系:

@import只有导入样式表的效果,而link不仅可以导入css文件还可以定义RSS,ref等

2.加载顺序:

@import引入的css在页面加载完毕后被加载,link标签引入的css是同时被加载

3.兼容性:

@import是CSS2.1的语法,需要IE5+中识别,link是HTML的元素标签,不存在兼容性问题

4.权重:

link引入的css样式权重大于@import引入的样式

*5.DOM可控性:

可通过js操作DOM来插入link标签改变样式,但不能通过插入@import来改变样式(因为dom方法是基于文档的)

建议

推荐使用link标签插入样式,而不推荐使用@import的方式