用戶生成自定義css

嘿，任何人有任何想法什麼是允許用戶保存自定義CSS的最佳方式是什麼？具體來說，我希望允許用戶選擇約4種顏色值，這些顏色將用於爲用戶創建自定義主題。我想保存在數據庫中的值，然後使用DOM：加載原型來設置自定義樣式值，但我想知道如果更快的方式？像動態創建css文件或什麼的？用戶生成自定義css

來源

2010-06-30 DavidP6

正如你所提到的那樣，將值放在內聯javascript中將是最簡單和最簡單的方法。否則，如果不爲每個頁面加載創建css文件，則必須管理動態創建css文件並控制瀏覽器緩存。看到我的回答如下： – 2010-06-30 19:42:38

，然後使用DOM：裝有原型

噢，不這樣做！ JavaScript關閉時不起作用。

方法1：靜態樣式表，在文件頭

對於沒有使用動態創建的樣式表工作的緣故動態值，與所有定義一個單獨的，靜態的CSS文件韓元't變化。

<link rel="stylesheet" href="styles/static.css" type="text/css"> 
<!-- Or whatever you name it -->

所有這一切將變化，你可以放入HTML文檔的head，從數據庫中獲取用戶可更換值的定義。

<style type="text/css"> 
.classname { font-size: (fontsize); } <-- Insert dynamic value here 
.classname { color: (color); }   <-- Insert dynamic value here 
.... 
<style>

這樣，CSS的大部分停留在靜態可緩存文件中，而動態部分不會導致另一個HTTP請求。

方法2：動態樣式表

如果你有大量的動態變化值，把整個樣式表到一個腳本文件並輸出，與數據庫中的值替換佔位符。這樣做的缺點是，爲了強制瀏覽器重新加載樣式表上的更改，你必須使用stylesheet.css?version=400版本的方法，這是相當複雜的，但有時可能比亂扔垃圾head部分CSS 。

您決定哪種方法更適合您的情況。我發現自己最經常選擇第一個。

來源

2010-06-30 20:21:42

+1，這次不需要使用JS，甚至不需要額外的文件抓取。 – 2010-07-01 05:47:06

我會將4個值保存在數據庫中，然後從這些值中創建一個css文件。您需要確保並緩存爲每個用戶創建的css文件，這樣您就不必在每個頁面視圖中動態創建它。

來源

2010-06-30 19:28:47

創建一個自定義的css文件會增加瀏覽器的另一個請求，因此您需要確保正確設置標題以緩存它。如果用戶做了更改他們的設置您需要做一些事情，以確保瀏覽器立即停止兌現舊的CSS文件並加載新的文件。一種方法是更改css文件的URL。

例子：

/usercustom.css?version=(last saved date hash)

相反我會用你的第一種方法，並創建你注入到頁面中一個JSON數組，然後你用你的JavaScript框架加載和使用數組風格這一頁。

您還可以將顏色值存儲在服務器的Cookie中，並在客戶端上使用和寫入它們。

來源

2010-06-30 19:32:29

用戶生成自定義css

回答

相關問題