Question

我正在尝试将所有css链接添加到一个。因此，它可以更快地加载页面。

我正在使用的链接是：

<link rel="stylesheet" href="index_files/stylesheet.css" type="text/css">
<link rel="stylesheet" href="/index_files/goStyle.css" type="text/css"/>
<link rel="stylesheet" href="/index_files/jquerylogin.css" type="text/css">
<link rel="stylesheet" href="/index_files/jquery-ui.css">

在研究方面，建议将所有css组合到一个文件中，但是我遇到影响不同标签的同一个类名的问题。

我尝试添加以下链接：

<link rel="stylesheet" href="index_files/stylesheet.css+goStyle.css+jquerylogin.css+jquery-ui.css" type="text/css">

但没有运气。

请有人帮助我。

Answer 1

请阅读此页：Combine and Minify Multiple CSS / JS Files

检查minify - 它允许你将多个js，css文件组合成   一个只是将它们堆叠成一个网址，例如

<script src="/scripts/js/main.js,/scripts/js/adapter/adapter.js"></script>

我们已经使用了多年，它做得很好并且可以随时使用   （无需编辑文件）。

Answer 2

如果将所有CSS组合成一个相同序列的CSS，它将具有相同的效果，如单独包含。

以相同的顺序组合所有CSS文件，如：

/* stylesheet.css */

/*### stylesheet CSS Goes Here ###*/

/* goStyle.css */

/*### goStyle CSS Goes Here ###*/

/* jquerylogin.css */

/*### jquerylogin CSS Goes Here ###*/

/* jquery-ui */

/*### jquery-ui CSS Goes Here ###*/

Answer 3

使用CSS导入规则

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

组合Css Inside你可以导入所有其他css，如下所示

@import url('/css/s1.css');
@import url('/css/s2.css');
@import url('/css/s3.css');

了解更多信息，请参阅以下文章

http://www.cssnewbie.com/css-import-rule/#.U2CN9Pk70dE

将css外部链接组合到一个链接

3 个答案: