怎么把多个css文件合并成一个文件

html-css037

怎么把多个css文件合并成一个文件,第1张

在一个css文件利用@import

url('其他的css文件')

想引入几个css文件就用几个@import

url

注意路径的的书写

首页需要两个css文件index.css和common.css

就在index.css的首行写入(两个css文件在同一个目录下)

@import

url('common.css')

这样只需要在首页链接一个index.css文件就可以了。

webpack把各个模块的css打包成一个方法：

webpack.config.js配置如下

var ExtractTextPlugin = require("extract-text-webpack-plugin")//extract-text-webpack-plugin安装此插件

module:{

loaders:[

{test: /\.css$/, loader: ExtractTextPlugin.extract("style-loader", "css-loader")}

]

},

plugins:[

new ExtractTextPlugin("css/[name].css")//则会生成一个css文件

]

比如你的js文件中这样引入即可：

import './css/lib/bootstrap.min.css'

import './css/test.css'

人民币就算了，丢不起这个份儿啊

在 HTML 里直接使用 CSS 和 JS，你只需要把 CSS 和 JS 文件里的代码复制到 HTML 代码的 <head></head>中间即可，最后应该是这样的

<head>

.

.

.

head 里面的其他标记

.

.

.

<style type="text/css">

    把 CSS 代码复制到这里

</style>

<script type="text/javascript" language="javascript">

<!--

    把 JS 代码复制到这里

-->

</script>

</head>