gpt4 book ai didi

javascript - 如何使用 css 在运行时更改和维护多个颜色主题?

转载 作者:搜寻专家 更新时间:2023-10-31 02:25:30 25 4
gpt4 key购买 nike

我希望我的网络应用程序具有不同颜色的主题:

所以现在我有:

RedTheme.css
蓝色主题.css

我在运行时动态加载每个。取决于用户在他的选项菜单中选择的内容。这行得通,但我不喜欢每个主题都有一个单独的文件。

选项 1。我想知道是否有任何方法可以做类似的事情:

Theme.css?Theme=Red 然后在 css 中让它根据该变量确定使用哪个。

选项 2。我也想知道是否可以在 CSS 中做一些类似的事情:

背景色:@themeBackgroundColor

然后以某种方式在运行时通过 javascript 或其他方式设置此变量。


如果选项 1 和选项 2 不可用,除了为每个主题保留不同的文件之外,您对主题化还有其他建议吗? b/c 也许我想要一个用户可以在未来选择自定义颜色的选项。

最佳答案

如果您想在 CSS 中使用变量,请查看 LessSass ,两者都有针对此的客户端解决方案。

要切换样式,您可以:

  • 为正文使用 ID 属性,例如 <body id="red">并以这个 id 为前缀的 css。所以#red myelement.myclass{}或者其他的东西。然后用 javascripts 切换 ID。
  • 您可以在服务器端有一个基本 CSS 文件和几个主题 CSS 文件(例如 gmail),并通过更改 URL 使用 javascript 在它们之间交换,这将在浏览器中生成一个新请求以获取另一个CSS。
  • 您可以寻找或编写自己的一些小框架,将适当的样式添加到 html 本身作为样式属性 ( like done here ),或者添加内联 style elements到您定义自定义样式的 html 并将它们替换为 javascript。

据我所知,javascript 对元素的 CSS 或 HTML 的任何更改都会触发浏览器再次呈现页面。

无法直接更改客户端硬盘上的 CSS 文件,因为 javascript 不允许这样做。但是,您可以更改缓存或 html 中的 CSS。

关于javascript - 如何使用 css 在运行时更改和维护多个颜色主题?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9946593/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com