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

    require能引入CSS吗

    藏色散人藏色散人2021-01-28 10:55:58原创1203

    require能引入CSS,其引入css的方法:首先下载require-css插件;然后修改require.config配置;接着加载ELEMENT;最后在页面上调用require_css方法传入css地址即可。

    本教程操作环境:windows7系统、HTML5&&CSS3版本,DELL G3电脑。

    推荐:css视频教程

    使用require模块化开发时,在require.config配置中,定义模块的引入路径时,有些是需要依赖css的,这个时候需要通过require-css插件,在github上可以下载到地址:https://github.com/guybedford/require-css。

    通过这个地址下载下来会有很多,如下图,我们只要css.js/css.min.js文件即可。

    7ad6f0fed23d3c09b7c2aec7c934948.png

    2. 在require.config配置中加入如下图的配置:

    165e8e5814e9103f38548bd8b0c800f.png

    3. 完成上面两部之后,就可以在require.config配置中shim增加依赖,在加载ELEMENT的时候需要提前加载index.css。写法如下:

    shim:{
        "ELEMENT": {
            "deps": ["vue", "css!assets/vue/element-ui/lib/theme-chalk/index.css"]
        }
    },

    4. 上面解决了,模块依赖css的问题,但是有时候还需要单独引入某个css的时候,当然啦,可以直接拖到html页面中加载。但是如果不想这样做的话,这个时候就可以通过改写require.config的写法来实现,将require的配置写成一个变量,然后在页面中在初始化,如下图:

    a8be1c0f60acbdefdaf4adaae178b6e.png

    要实现上图写法,首先要准备一个base.js文件,这个文件中只需要写document.body.style.visibility = 'visible';这么一句话就可以了(也可以写其他的),然后在requireConfig配置的同一个js中增加一个方法,用来向base的依赖中增加css,写法如下图红框。

    然后在页面上调用require_css方法传入css地址,这样css将会引入到页面中,写法如下:

    8a6d7a6dc9a670b2defd5e335521ff7.png

    这样就大功告成了。

    以上就是require能引入CSS吗的详细内容,更多请关注php中文网其它相关文章!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    专题推荐:require
    上一篇:怎么下载网页的css文件 下一篇:css 怎么设置div不可点击
    PHP编程就业班

    相关文章推荐

    • php中require的作用是什么• php require用法详解• 如何解决php require once报错问题• css3 menu怎么用

    全部评论我要评论

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

    PHP中文网