欢迎光临杨雨的个人博客站!

杨雨个人网站-杨雨个人博客-杨照佳

杨雨个人博客网站

关注互联网和搜索引擎的个人博客网站

首页 > WEB开发 > css3案例分享 >

@import怎么引入CSS文件?有什么方法

发布时间:2019-05-24  编辑:杨雨个人博客网站   点击:   

本篇文章给大家带来的内容是关于@import怎么引入CSS文件?有什么方法,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

@import引入CSS样式表文件

@import url (url) sMedia ;

说明:

url : 使用绝对或相对地址指定导入的外部样式表文件。相等于link引入CSS文件。(了解link与@import区别和如何选择)

Css @import使用常用两种方法

第一种:Html源代码(Html文件里)直接引入外部样式表CSS文件

Html文件index.Html代码:

<!DOCTYPE Html>
<Html>
<head>
<meta charset="utf-8" />
<title>import使用实例</title>
<style>
@import url(images/style.Css);
</style>
</head>
<body>
<span class="wai">实例测试内容</span>
</body>
</Html>

images文件夹里style.Css文件代码:

@charset "utf-8";
/* php - www.itbyc.com */
.wai{ color:#F00}

效果如下:

微信截图_20181122165026.png

以上可以看见在HTML代码中使用@import是需要使用style标签。

小结:要在HTML源代码直接使用@import引入外部CSS样式表文件,需要将@import放入<style>标签才能成功,就像HTML直接写CSS代码也需要style标签。

第二种:CSS文件代码中使用@import引入另外一个CSS文件

除了HTML源代码中使用style标签来使用@import,在CSS文件代码中依然可以使用@import,这个时候就不需要style标签,而是直接使用@import即可,这样即可实现一个(多个)CSS文件中引入套入另外一个(多个)CSS文件。

本文地址:http://itbyc.com/web/css3/19967.html
转载请注明出处。
分享是一种快乐,也是一种美德:
博客首页 | WEB开发 | 网站运营 | CMS使用教程 滇ICP备14002061号-1