网站首页 > 网络编程 > html 正文

CSS的@import的用法

三叶资源网 2020-10-16 23:48:16 html 938 ℃ 1 评论

CSS的@import的用法:

@import在很多页面都有应用，不过使用的频率还是比link标签要少的多，所以可能还有很多布局者对此不是太熟悉，下面就简单介绍一下它的用法。它是用来引入外部样式表的一种方式，格式有以下两种:

@import "style.css";
@import url("style.css");

@import既可以为页面引入外部样式表，也可以在一个样式表中引入另一个样式表，代码实例如下:

实例一:

<!DOCTYPE html> 
<html> 
<head> 
<meta charset=" utf-8"> 
<meta name="author" content="http:www.sanye.cx/" /> 
<title>三叶资源网</title> 
<style type="text/css">@import "mytest/div+css/mytest.css";</style> 
</head> 
<body> 
<div id="mytest">三叶资源网</div> 
</body> 
</html>

以上代码通过@import为网页引入了外部样式表，将字体颜色设置为红色。

实例二:

@import也可以在一个样式文件中引入其他样式文件，比如一个网站的代码量比较大，CSS样式表文件也比较庞大，就可以使用此方法把不同功能模块的样式代码放入各自样式表中，然后再通过@import引入到一个主样式表中。

@charset "utf-8";
/* CSS Document */
@import url("one.css");
@import url("two.css");
@import url("three.css");

注意:不过最好不要使用@import，因为使用它加载的样式文件会等到页面都加载完成再被加载，这样可能会导致页面浏览出现问题，建议使用标签替代，可以参阅CSS的link和@import的区别一章节。

好用的代理IP，游戏必备	____广告位招租____	服务器99/年	____广告位招租____	____广告位招租____	挂机，建站服务器
好用的代理IP，游戏必备	____广告位招租____	服务器低至38/年	____广告位招租____	____广告位招租____	挂机，建站服务器

网站首页 > 网络编程 > html 正文

CSS的@import的用法

猜你喜欢

已有1位网友发表了看法：

取消回复欢迎你发表评论:

网站首页 > 网络编程 > html 正文

CSS的@import的用法

猜你喜欢

已有1位网友发表了看法：

取消回复欢迎 你 发表评论:

取消回复欢迎你发表评论: