Question

我要求客户向MVC / Bootstrap Web应用程序添加功能，以允许用户设计他们的门户页面以适应他们的公司品牌颜色在表单元素上，如按钮，链接等。我＆＃39; m不知道如何实现这一点。我的想法是将元素和颜色保存到db表中，其中fk为[user]。然后以某种方式动态创建一个css文件并将其保存到本地存储，然后将用户特定的css注入页面onload。任何帮助/指导将不胜感激。

Answer 1

Scoped CSS可以用于此，但浏览器支持很少目前所以必须对选择者进行范围界定。

如果您使用数据库来存储和收集客户数据。。如果您在客户表中创建一个名为“custom_styles”的字段。如果你存储这样的css片段：

    <style scoped type = "text/css">
    #form-container fieldset {
    background: Violet;
    }

    #form-container form header {
    background: url("http://customer.com/customer-logo.png");
    }

    #form-container input {
    margin: 4px;
    border: 2px solid blue;
    }
    </style>

如果您将数据存储在像$ custom_styles这样的php变量中。。

您可以在页面内部的任何位置注入css 您想要自定义样式的块元素：

<div id = "form_container">
    <?=$custom_styles?>
    <!--  bunch of html  -->
</div>

所以，如果你把它放在容纳你想要的表格的容器里面自定义，所有样式将仅应用于该容器。

容器也将继承页面样式，但它们将是如果在scoped css中声明，则重写。

页面的任何其他部分都不会受到这些范围样式的影响。

希望你觉得这很有用。

允许用户设置HTML元素CSS

1 个答案: