一个http请求可以调用多个css文件吗？答案

【问题标题】：Can one http request call multiple css files?一个http请求可以调用多个css文件吗？
【发布时间】：2013-08-16 08:06:17
【问题描述】：

是否可以通过一个http请求在header标签中添加多个css来一次执行所有css文件？

我知道

@import url('/css/typography.css');
@import url('/css/layout.css');
@import url('/css/color.css');

我们可以做类似的事情或任何其他解决方案来减少http requests

<link rel='stylesheet' href='/css/typography.css,layout.css,color.css'>

【问题讨论】：

如果您确实需要最小化 http 请求，请尝试合并 css 文件（如果它们相关并且可行）。

标签： html css performance httprequest

【解决方案1】：

不，但您可以将所有样式表合并到一张表中，然后像这样导入：

<link rel='stylesheet' href='/css/main.css'>

【讨论】：

【解决方案2】：

捆绑您的 CSS 文件以用于生产并缩小 ofc。

http://www.sitepoint.com/faster-page-loads-bundle-your-css-and-javascript/

【讨论】：

是的，我正在寻找相同的页面sitepoint.com/faster-page-loads-bundle-your-css-and-javascript

【解决方案3】：

是的，您可以使用 ASP.NET MVC 捆绑和缩小功能。你像这样创建一个包：

bundles.Add(new StyleBundle("~/Content/customcss").Include(
      "~/Content/css/typography.css",
      "~/Content/css/layout.css",
      "~/Content/css/color.css"));

你可以像这样渲染它（在 Razor 视图中）：

@Styles.Render("~/Content/customcss")

在发布编译模式下，你的包会被自动合并和缩小，但你也可以在调试模式下手动设置标志：

BundleTable.EnableOptimizations = true;

参考this。

【讨论】：

【解决方案4】：

可以吗？使用 apache/nginx MODPAGESPEED https://www.modpagespeed.com/

<head>
<link rel="stylesheet" type="text/css" href="styles/yellow.css">
<link rel="stylesheet" type="text/css" href="styles/blue.css">
<link rel="stylesheet" type="text/css" href="styles/big.css">
<link rel="stylesheet" type="text/css" href="styles/bold.css">
</head>

可以变成

<head>
<link rel="stylesheet" type="text/css" href="styles/yellow.css+blue.css+big.css+bold.css.pagespeed.cc.xo4He3_gYf.css">
</head>

免责声明：Apache PageSpeed 是 Apache 软件基金会 (ASF) 孵化的一项成果，由 Apache 孵化器赞助。

【讨论】：