在单个文件中串联样式表

时间:2018-07-10 21:59:50

标签: css html5 sass

在用HTML声明然后在HTML中声明而不是在HTML中单独声明之前,将网页的所有多个样式表串联在一起是否更好?

还是将在网站的不同页面(例如reset.css)上重复的文件分开放置是更好的选择,因为它们将被缓存到下一页?

因此,您最终得到的HTML外观如下:

<head>
  <meta charset="UTF-8">
  <title>...</title>
  <link rel="stylesheet" href="css/style.css">
</head>

代替:

<head>
  <meta charset="UTF-8">
  <title>...</title>
  <link rel="stylesheet" href="css/reset.css">
  <link rel="stylesheet" href="css/site.css">
  <link rel="stylesheet" href="css/home.css">
  ...
</head>

我之所以这样问,是因为我刚刚开始学习Sass,并且看到它可以使用多个scss文件来更好地组织它们,然后将它们全部合并到一个浏览器中css

1 个答案:

答案 0 :(得分:0)

最好将CSS编译为一个文件。您之所以经常看到这种情况,是因为浏览器存在一次加载4个资产的瓶颈。即使加载每个文件需要花费毫秒,您也可以在一个服务器请求中加载所有网站的CSS,而不是8,打开浏览器以加载图像,字体,JS库等。

要注意的一件事是css的编译顺序。您可能会感到头疼,试图弄清为什么样式与最后一次编译的样式表一样简单,却被覆盖。