如何使用 php/Mysql 动态更改 CSS 样式。我想创建每个用户独有的主题?

Posted

技术标签:

【中文标题】如何使用 php/Mysql 动态更改 CSS 样式。我想创建每个用户独有的主题?【英文标题】:how to change CSS styles dynamically using php/Mysql..i want to create themes that are unique to each user? 【发布时间】:2013-04-25 03:16:30 【问题描述】:

我想更改网页的配色方案...所以我在我的网站中提供了颜色选择器和其他工具,并将这些颜色值存储在 mysql 数据库中..

但我不知道如何将这些样式值从 mysql 数据库应用到 css 或 html 文件..

例如:

user-1在数据库中存储的颜色值为:#ffffff user-2 的另一个值是:#000000

每次用户登录时,我如何才能将这些值应用到 css 中。 即,当用户 1 登录时,我希望正文背景为 #ffffff,而对于 iser-2,我希望它为 #000000

【问题讨论】:

您能否编辑您的问题,告诉我们更多关于该网站的信息以及您的用户将如何/为什么改变他们的风格? 用户应该能够定义任何颜色还是只是几种颜色可供选择? 【参考方案1】:

有多种方法可以做到这一点。 1. 将您的 CSS 转换为 php,即生成 CSS,但一切都可以是动态的 - 可能对于一些颜色来说有点矫枉过正 2.覆盖样式表中的样式

最简单但可能不是最好的方法是第 2 种方法,用新颜色覆盖样式表之后的样式。

即(sudo 代码)

<html><head>
....
<style ... src="..." />
<style>
// from db
#custom  background: #<?php echo $colour; ?> 
</style>

【讨论】:

【参考方案2】:

您可以通过以下步骤实现:

    使您的网站模板灵活,如果用户更改一种样式,它应该反映所有主题。

    当用户登录后,您可以从 db 中获取该用户主题颜色,然后您可以将其存储在会话中或任何其他可能的方式中。

    e.g : $themecolor = '#000000';
    

    将该主题颜色传递给正文背景内联样式

    e.g : style = "background-color : <?php echo $themecolor; ?>"
    

【讨论】:

【参考方案3】:

我使用这个技巧:

我创建了一个 dynamicss.php 文件并在其中使用:

$color = '#6b82a2';
$css = <<<HERE

body
    font-family:Arial, Helvetica, sans-serif;
    background-color : $color ;
    background-image: url("../img/texture.png");


HERE;

$bytes = file_put_contents('css/mainCss.css',$css);

你可以加载你的变量,然后在 hereDoc 中使用。

【讨论】:

总的来说,我喜欢这种方法背后的想法。但是,如果每次访问者点击您网站上的页面时都会附加 css,那么您的 css 文件会很快变得不守规矩。我几乎宁愿使用您的技术,但将内容类型设置为 css 并调用 dynamiccss.php 作为第二个样式表,在第一个样式表之后加载。 感谢您的评论,是的!更好【参考方案4】:

最好使用 javascript 更改 PHP 标记之间的样式。

例如:

if($response)

    echo "<script>
        $('#matter_table').css('display', 'block');
    </script>";

else

    echo "<script>
        $('#matter_table').css('display', 'none');
    </script>";

【讨论】:

以上是关于如何使用 php/Mysql 动态更改 CSS 样式。我想创建每个用户独有的主题?的主要内容,如果未能解决你的问题,请参考以下文章

如何使用 css 和/或 javascript 动态更改样式

如何动态更改 CSS 光标 vuejs

如何动态更改 css 值(如整个应用程序中的颜色)等

如何使用tailwind css动态更改下一个js中的边框颜色?

如何在反应 js 代码中动态更改 css 选择器属性值?

如何动态更改 HTML 标签的 CSS 类?