• 技术文章 >web前端 >css教程

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

    云罗郡主云罗郡主2018-11-22 16:53:05转载1633
    本篇文章给大家带来的内容是关于@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 - m.sbmmt.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文件。

    以上就是对@import怎么引入CSS文件?有什么方法的全部介绍,如果您想了解更多有关CSS3教程,请关注PHP中文网。

    以上就是@import怎么引入CSS文件?有什么方法的详细内容,更多请关注php中文网其它相关文章!

    声明:本文转载于:thinkcss,如有侵犯,请联系admin@php.cn删除
    上一篇:div字间距-div内文字之间间距设置方法 下一篇:如何让超链接文字隐藏掉css代码
    大前端线上培训班

    相关文章推荐

    • 为什么在CSS中不要再使用@import_html/css_WEB-ITnose• link与@import的区别• css和@import区别用法• link和@import引用css文件方法的区别• css link和@import的区别 • 浅谈css和@import区别及用法详解

    全部评论我要评论

  • 取消发布评论发送
  • 1/1

    PHP中文网