有没有办法在HTML中使用图层并将CSS文件应用于特定图层

Question

背景：

市场上有不同的工具和组件可以帮助开发人员/设计人员毫不费力地创建可接受的HTML界面。问题是这些工具中的每一个都有自己的 css 设置，它们不能很好地协同工作。例如，要从一个供应商的用户 ASP.NET 控件和另一个供应商的特殊按钮集，由于css初始化和盒子模型等原因，必须做大量的专业工作才能使两者在同一页面上协同工作。

我的问题：

A - 图层和画布的概念已经在HTML5中实现，但我看到它主要用于图形（和游戏）开发。在HTML5中是否可以创建多个层，其中每个层都可以与一组唯一的（1个或多个）css文件相关联，从而防止将css设置应用于另一个层？通过这种方式，可以将可视组件分组到多个层并毫无问题地使用它们。

我的理解是这是不可能的。

B - 您是否看到更好的方法来解决上述背景中描述的混合来自不同组件的css文件的问题？

谢谢。

Answer 1

A - 你是对的。这不可能！

B - 您可以使用一些类vendor-a将供应商 A 组件包装在div 中，然后在此供应商 A .css文件上的所有 CSS 类前面加上 .vendor-a class 的前缀。

例：在供应商 A 上安装您.css一种冲突的按钮样式：

button { ... } 

您必须为其添加前缀：

.vendor-a button { ... } 

在您的 HTML 上，您必须将组件包装在：

<div class="vendor-a">
    <!-- Vendor A component goes inside -->
</div>