src和href区别:

1)请求资源类型不同

href 属性设置外部资源的路径,指定被链接资源的URL。 URL 可以是绝对的,也可以是相对的。 应用场景: link 、a ;

src 属性指定了包含请求的资源,在请求 src 资源时会将其指向的资源下载并应用到文档中。 应用场景:img、iframe、js;

2)作用结果不同

href 用于在当前文档和引用资源之间确立联系;

src 用于替换当前内容;

3)浏览器解析方式不同

href :  若在文档中添加href ,浏览器会识别该文档为 CSS 文件,就会并行下载资源,并且不会停止对当前文档其他内容的处理。这也是为什么建议使用 link 方式加载 CSS,而不是使用 @import 方式;

src :  当浏览器解析到src ,会暂停其他资源的下载和处理,直到将该资源加载、编译、执行完毕,图片和框架等亦如此,类似于将所指向资源应用到当前内容。这也是为什么建议把 js 脚本放在底部而不是头部的原因;

 

 

link和@import的区别:

link标签和@import导入css文件是不同的,两者都是外部引用 CSS 的方式,但是存在一定的区别:


(1)link是XHTML标签,除了能够加载CSS,还可以定义RSS等其他事务;而@import属于CSS范畴,只可以加载CSS;


(2)link引用CSS时,在页面载入时同时加载;@import需要页面完全载入以后再加载;


(3)link是XHTML标签,无兼容问题;@import则是在CSS2.1提出的,低版本的浏览器不支持;


(4)link支持使用js控制DOM改变样式;而@import不支持。

参考资料:https://blog.csdn.net/lhjuejiang/article/details/80795081