如何隔离可嵌入Web组件的css类

我已经为数据可视化编写了一个嵌入式Web组件。当然，除了js和html之外，还有相关的css类。我需要隔离css类，这样它们就不会覆盖和/或破坏它嵌入的更大Web应用程序上下文的css类名

实现这一点的最佳实践是什么？

解决此问题的一种可能方法是使用。我不喜欢这个解决方案，只在没有其他可能的情况下才使用它

我刚刚发现不支持作用域，至少不是所有浏览器都支持它

另一个解决方案是为所有CSS类和id使用前缀，但如果文件很大，这可能需要很多时间

---

顺便说一句，如果嵌入意味着在iframe中，那么没有问题，因为它不应用嵌入的站点的css。

您可以创建带有定义的.css文件（从.and#开始）在每个网页中嵌入特定的.css文件，是的，您必须确保定义是唯一的。因此没有名称空间或类似的概念？据我所知，没有：）另一种可能的解决方案是在组件的模板中插入容器div，并要求所有css类都是组件的子类您分配给容器div的类或id。@w3re我从未考虑过该选项。也许我将来可以使用它，因为我自己也是一名前端开发人员：）