css中的@inport 与link

mac2022-06-30  30

在html 代码中我们常常用分离的思想引入外部的css文件,常用的方法有2种,@import

语法:

<style type="text/css" media="screen"> @import url("text.css"); </style>

link  语法:

<style type="text/css" > <link href="text.css"/></style>

那么这 两种引入方式有什么区别么?

首先:它们的相同点:从外部引入文件,易于维护,当很多相同标签需要改同一个属性时,在css文件中只需改动一处即可。

区别:

@@@@@@@@@

link 是html的一个标签,而@import是css的一个标签。

1、@import 只是css提供的一种方式,只是加载css,link  除了加载css外,还可以定义rel连接属性,定义rss属性.

2、加载顺序的问题:页面加载时,link的css会同时加载,而@import 的css会在html下载完成后才开始加载(在网速慢的时候,浏览器加载页面可能会出现没有样式的情况)。

3、link标签兼容性问题,而@import是在css2.1以后提出的,对于老版本浏览器,会出现不支持况,对于IE5以后的版本能支持。

4、使用JavaScript控制DOM去改变样式的时候,只能使用link  ,@import 不是DOM可控制的。

5、@import 可以在css中再次引入其他样式表。

 

转载于:https://www.cnblogs.com/autumn123/p/4190782.html

相关资源:JAVA上百实例源码以及开源项目
最新回复(0)