是否可以包含css文件的文件夾？

Question

我有大約100個樣式表，它們將相同的樣式應用於一個文檔，就像zen css頁面一樣，我可以逐個列出這些文件，但它們都在同一個文件夾中，所以看起來有一種更簡單的方法。 那就是...？

我正在使用ruby，但我寧願只列出一個文件夾。

<% Highlight.all.each do |hl| %>
    <%= stylesheet_link_tag "css/#{hl.name}" %>
<% end %>

看着禪園這是他們的來源

在發布一些答案后添加

這是一個文件

<style type="text/css" title="currentStyle" media="screen">
@import "/205/205.css";</style>

這是第二種CSS風格

<style type="text/css" title="currentStyle" media="screen">
    @import "/001/001.css";
</style>

什么是@import？ 這意味着什么？

Answer 1

無論如何都無法使用CSS，HTML或JS自動下載整個文件夾（或目錄樹中包含的所有文件）（盡管可以使用JS +服務器端腳本）。

我發現的最佳解決方案是編寫一個shell腳本，將項目中使用的所有CSS / JS文件打包成一個文件。 這不僅可以改善生產站點上的頁面加載時間，還可以輕松壓縮代碼。

這里有幾個鏈接可以幫助您：

Answer 2

沒有辦法，僅使用CSS和HTML，包含文件目錄。 您可以使用包含其他文件的一個文件，為您提供更加模塊化的插入文件方式：

@import url("stylesheet1.css");
@import url("stylesheet2.css");
@import url("stylesheet3.css");
...

如果您可以使用服務器端語言，則可以通過多種方式自動插入文件。

Answer 3

每種方法都有一些優點和缺點：

對於＃1：您需要編寫腳本，或使用現有腳本。 您還可以實現一些簡單的緩存機制，以便不在每個請求上獲取和連接文件。 好消息是css僅在一個HTTP請求中提供。
對於＃2：與上述類似。 另外一個缺點是你必須手動觸發css文件的打包作為一個連接文件。 您的Web服務器應該能夠非常有效地提供靜態文件，但是通過適當的緩存，可以使之前的解決方案與此方案一樣高效。
對於＃3：可能是最簡單的方法，但這會為每個CSS文件發出單獨的HTTP請求。 除了對Web服務器的額外命中外，這對前端渲染性能沒有幫助。 有數百個css文件，我認為我不會考慮這個選項。

Answer 4

從性能的角度來看，您可能應該將它們合並到服務器端。

您沒有提及您的語言或體系結構，但有一些工具可用於連接和縮小這些文件。

Answer 5

我會做這個服務器端...

使鏈接到其他主題傳遞一個參數，稱之為ThemeID，然后是類似的東西

<link href="styles/<%= Request.ThemeID %>.css" rel="stylesheet" type="text/css">