Home > Article > Web Front-end > CSS的@import的用法_html/css_WEB-ITnose
CSS的@import的用法_html/css_WEB-ITnose
- WBOYOriginal
- 2016-06-21 09:10:211684browse
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.softwhy.com/" /> <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的区别一章节。
原文地址是:http://www.51texiao.cn/div_cssjiaocheng/2015/0503/585.html
最为原始地址是:http://www.softwhy.com/
Statement：
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Previous article：HTML代码风格检查工具对比_html/css_WEB-ITnoseNext article：HTML data属性_html/css_WEB-ITnose