html – 为个性化页面视觉效果存储和返回自定义CSS的有效方法

html – 为个性化页面视觉效果存储和返回自定义CSS的有效方法,第1张

概述我有一个Web应用程序需要显示CSS值通过表单设置的页面.要明确:不是CSS参数,只是它们的值是用户定义的. 我正在使用一个框架(jquery mobile).我的css文件大约有700行(sass文件有点长,但有很多颜色,边距等的注释和变量).用户可以定义大约十几个变量(例如$pageBackgroundColor,$borderWidth,$spanColor),但是每个变量在sass文件中多 我有一个Web应用程序需要显示CSS值通过表单设置的页面.要明确:不是CSS参数,只是它们的值是用户定义的.

我正在使用一个框架(jquery mobile).我的CSS文件大约有700行(sass文件有点长,但有很多颜色,边距等的注释和变量).用户可以定义大约十几个变量(例如$pageBackgroundcolor,$borderWIDth,$spancolor),但是每个变量在sass文件中多次使用.

假设我现在已经将这十几个变量安全地存储在我的数据库中,并且用户请求一个页面.我如何提供必要的CSS?

我可以:

>在表单提交和链接时编译缩小的CSS文件
当请求页面时(缺点:我的服务器上可能有几千个CSS文件)
>编译一个缩小的CSS文本字符串并将其转储到两个< style>之间. < head>中的标签(缺点:丑陋,没有缓存,请求处理时间增加)

还有其他选择吗?我查看了一个为每个用户执行自定义视觉效果的网站,他们为每个人提供了一个单独的CSS文件.

我正在使用Django Postgres后端,如果它是相关的.

解决方法 您可以在< head>中将使用这些变量的样式声明移动到内联CSS中.此外,您可以使用几种样式执行此 *** 作,但它确实需要您向HTML添加更多类:

<style type="text/CSS">    .user-background-color {        background-color: #abc123;     }    .user-color {        color: #abc123;     }    .user-border-color {        border-color: #abc123;     }</style>

然后你的HTML获得了额外的类:

<div ></div>
总结

以上是内存溢出为你收集整理的html – 为个性化页面视觉效果存储和返回自定义CSS的有效方法全部内容,希望文章能够帮你解决html – 为个性化页面视觉效果存储和返回自定义CSS的有效方法所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1052816.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-25
下一篇 2022-05-25

发表评论

登录后才能评论

评论列表(0条)

保存