如何将CSS公开为可在小部件上配置

Question

我正在尝试构建一组小部件，以允许每个客户端在其页面上配置样式。

是否可以公开类，id或允许客户端修改样式的内容？我尝试用!important覆盖，但似乎没用

Answer 1

我将从此开始。您无需使用.wrapper > .my-container覆盖默认样式。您需要检查两件事，以使CSS替代优雅地工作。

1. 替代样式表的结构正确。如果您的默认样式表使用.my-container定义了一条规则，则覆盖不能仅为 npm install rxjs@6 rxjs-compat@6 --save 定义一条规则（默认样式是更强的规则，并且将优先于覆盖样式表）。您必须在覆盖样式表中覆盖相同的类结构。
2. 替代样式 包含在默认样式表之后。

关于如何应用自定义客户端样式，假设您希望保存和加载这些样式而不是临时的，则有一些选择。

一种是允许客户端自定义变量，例如十六进制值，宽度等。然后，您可以将这些CSS值存储在数据库中，并为该客户端提供自定义样式表，以覆盖这些类。缺点是客户端可能会存储看起来不好或破坏东西的值，例如白底白字（需要验证）。

另一个选项是生成一组预设类或“主题”（例如，一个类用于紫色，另一个用于黄色，一个用于大尺寸小部件，一个用于小尺寸等）。然后，只需存储客户端选择的选项，然后以编程方式将其应用到前端即可。这将不需要相同的验证，提供自定义样式表，也不需要在数据库中存储CSS字符串，但是会在一定程度上限制客户的选择。