如何在不包含整个文件的情况下在 css 中使用 PHP 变量？

Question

所以，我正在使用 UIKit，并认为我会“聪明”。所以，我把它变成了一个 .php 文件，添加了样式标签，并将它包含在我的页面中。显然，这是一个非常糟糕的主意。每个页面都插入了 12,241 行代码，我的网站甚至几乎无法加载。我正在尝试为我的用户选择主题选项。所以，我是这样做的：

// Retrieve theme data
$query to select theme information, such as colors

// Example of how this data is used
<style>
.uk-input,
.uk-select,
.uk-textarea {
    /* 1 */
    max-width: 100%;
    /* 2 */
    width: 100%;
    /* 3 */
    border: 0 none;
    /* 4 */
    padding: 0 10px;
    background: #<?php echo $theme_color1; ?>; // RETRIEVED FROM DB
    color: #<?php echo $theme_color3; ?>; // RETRIEVED FROM DB
    border: 1px solid #<?php echo $theme_color2; ?>; // RETRIEVED FROM DB
    transition: 0.2s ease-in-out;
    transition-property: color, background-color, border;
}
</style>

因此，当 css 很大时，这是一种非常糟糕的方法。谁能建议我为我的用户选择主题选项的正确方法？我将不胜感激。谢谢。

Answer 1

你可以试试这个： 使用您的默认 CSS 信息创建一个单独的 styles.css 文件，并在您的代码中确保使用链接来引用 CSS 文件。然后，您可以通过更改来回显样式标签。在你的情况下，在你的styles.css中给它一个默认的黑色颜色，然后在你的代码中，使用你在css文件中使用的相同选择器只引用颜色：

styles.css：

.uk-input,
.uk-select,
.uk-textarea {
    /* 1 */
    max-width: 100%;
    /* 2 */
    width: 100%;
    /* 3 */
    border: 0 none;
    /* 4 */
    padding: 0 10px;
    background: black;
    color: black;
    border: 1px solid black
    transition: 0.2s ease-in-out;
    transition-property: color, background-color, border;
}

在您的 PHP 代码中：

echo '
    .uk-input,
    .uk-select,
    .uk-textarea {
        background:'. echo $theme_color1 . ';
        color:'. echo $theme_color3 . ';
        border: 1px solid '. echo $theme_color2 . ';
    }
';

对不起，如果代码不是超级可读，我正在手机上这样做。