用户生成的自定义CSS

Question

嘿,任何人都知道允许用户保存自定义CSS的最佳方法是什么？具体来说,我希望允许用户选择大约4种颜色值,这些颜色将用于为用户创建自定义主题.我正在考虑在数据库中保存值然后使用dom:装载原型来设置自定义样式值,但我想知道是否更快的方式？像动态创建css文件或什么？

Answer 1

然后使用dom:装载原型

Awww,不要那样做!当JavaScript关闭时,这将不起作用.

方法1:静态样式表,文档头中的动态值

为了不必使用动态创建的样式表,请使用一个单独的静态CSS文件,其中包含所有不会更改的定义.

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

所有将要更改的定义,您可以放入headHTML文档,从数据库中获取用户可更改的值.

<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部分.

您可以决定哪种方法更适合您的情况.我发现自己最常选择第一个.