如何根据用户的设置动态设置网站的主题色?

2017-03-02 10:02:03 +08:00
 ibufu

项目是前后端分离的,不想依赖后端渲染

2159 次点击
所在节点    问与答
14 条回复
A3m0n
2017-03-02 10:14:26 +08:00
写两份 css 然后通过 js 来改变
顺便把当前状态存在用户本地
ibufu
2017-03-02 10:46:00 +08:00
@A3m0n 颜色不固定
ibufu
2017-03-02 10:48:25 +08:00
@A3m0n 这个网站是一个电商性质的,不同的商家任意配置。普通用户访问不同的商家看到的颜色是不一样的,存在本地没有意义。
qiayue
2017-03-02 10:55:25 +08:00
你再怎么前后端分离,数据还是从后端来的啊

等等,你到底是要不同的颜色(网页布局一致,仅配色)还是要不同的主题(布局、展示的内容都可能不一致)?
ibufu
2017-03-02 14:15:34 +08:00
@qiayue 颜色。
ibufu
2017-03-02 14:20:23 +08:00
这里前后端的分离的意思主要是不依赖后端渲染。
目前想到的方案是预制一套 css 模板,接收到后台的颜色后, replace 模板里的颜色,再将模板插入 html 中。
Ncanback
2017-03-02 17:38:48 +08:00
只是配色的话 可以这样 red.css blue.css 里面只写各个 color border-color background-color 等等
style.css (主 css ) 里也应该有默认样式
用户登录后台传递一个参数给前端,前端根据参数,引用相应的 css ,覆盖默认样式( VIP2 用户进入 后台传递 red 前端引用 red.css , vip3 用户进入 后台传递 blue 前端引用 blue.css ,普通用户不引用,使用 style.css 的默认样式)
warpbootstrap 上很多模板 侧边工具栏调整网站配色 效果和你说的差不多 只不过你这个靠用户来判断
布局的话就太麻烦了 ....你得写多少类似 css....
LittleWhiteMouse
2017-03-02 17:42:06 +08:00
LESS 可以直接引入的……
ibufu
2017-03-02 19:18:53 +08:00
@Ncanback 用户可以自定义任何颜色,所以没办法预制 red.css blue.css
Ncanback
2017-03-02 22:59:48 +08:00
@ibufu 用户动态更改 sass ?
zhihaofans
2017-03-03 00:54:22 +08:00
jquery.css()?
ys0290
2017-03-03 07:17:21 +08:00
你三楼的描述来看,只能存在网站里面,存在数据库里面咋么样?可以问问站长,本站就是这样的,有的节点是自定义背景的
ibufu
2017-03-03 09:51:20 +08:00
@Ncanback 就是会有个输入框,让用户自己输入色值。
@ys0290 把什么存数据库里?
ys0290
2017-03-03 11:42:34 +08:00
@ibufu css

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/344259

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX