Question

将多个CSS文件连接成一个CSS文件的最佳方法是什么？

我想减少以下内容..

<link href="css/1.css" rel="stylesheet" type="text/css" media="all">
<link href="css/2.css" rel="stylesheet" type="text/css" media="all">
<link href="css/3.css" rel="stylesheet" type="text/css" media="all">

..进入..

<link href="css/1-3.css" rel="stylesheet" type="text/css" media="all">

简单地执行cat css/*.css > css/1-3.css似乎没有做到这一点。

Answer 1

只要cat的参数的排序与HTML文件中三个引用的CSS文件的原始排序相匹配，cat - 方法应该按预期工作

所以说... ..

<link href="css/one.css" rel="stylesheet" type="text/css" media="all">
<link href="css/two.css" rel="stylesheet" type="text/css" media="all">
<link href="css/three.css" rel="stylesheet" type="text/css" media="all">

..以下的concaternation ..

cat css/one.css css/two.css css/three.css > css/all.css

..将以下参考..

<link href="css/all.css" rel="stylesheet" type="text/css" media="all">

..应该100％完全相同。

Answer 2

在3.css的开头你可以添加：

@import url(/css/1.css);
@import url(/css/2.css);

但我更喜欢使用多个链接标记，或者更好的是，将我的CSS压缩为1个文件（例如，使用YUI compressor）。

Answer 3

您还可以使用mod_concat或PHP solution来合并CSS和JS文件。

仅供参考，Robert Nyman最近写了一篇关于optimizing CSS and JavaScript files的文章。

Answer 4

您始终可以从HTML中包含的主CSS导入辅助CSS文件。这是a nice and simple tutorial。

将多个CSS文件连接成一个

4 个答案: