如何从期望不同布局的外部样式表中提取一些CSS规则

时间:2019-08-05 14:09:20

标签: css sass

对于我工作的组织,应该有一个通用样式表,所有Web应用程序都应该使用该样式表。

例如,他们希望test.size()-2中的某些元素可以添加排序图标。现在,在Angular应用程序中,我使用一个组件库(primeng),该组件库具有一个简单的元素,而该元素仅具有thead.table-sortable th.table-sortable-sorted-down a:after类。

如何将组织css的一部分映射/复制/使用到应用程序的css中,以仅复制有趣的内容而无需在组件上进行复杂的嵌套(无论如何我都无法控制)?

我们可以使用CSS,SASS,甚至可以在JavaScript中动态生成CSS规则。我宁愿避免在运行时更改所有匹配组件的DOM,因为它可能非常动态。

编辑:构建时解决方案(例如使用sass)不是首选方法,但如果没有其他选择,则可以接受。

1 个答案:

答案 0 :(得分:0)

如果公司样式表对您来说是 readonly ,那么您根本无能为力。您将需要在需要文档的某些部分的地方加载整个文档。避免这种情况的一种可能的“解决办法”是编写一个后端程序(在PHP或node.js中),该程序打开公司样式文档并仅查找特定的CSS规则,然后将其复制并粘贴到其他样式文档中。 / p>

但是,这种方法也是非常动态的,并且您需要在每个请求中执行后端脚本,因为原始公司样式表可能会随时更改...如果您的公司同意,则应使用SASS这样的预处理器或LESS并定义公司样式的结构,将其分为多个文档,可以有目的地加载这些文档。