React中CSS类样式失效但ID样式正常的问题求助

• 样式优先级冲突：Quill官方自带的CSS使用了更具体的选择器（比如.ql-container .ql-editor），如果你的自定义类选择器优先级低于它，样式会被直接覆盖。ID选择器的优先级远高于类选择器，所以能正常生效。
• CSS模块化类名哈希化：如果你的React项目启用了CSS Modules（比如样式文件命名为xxx.module.css），自定义类名会被自动添加哈希后缀，但Quill生成的DOM节点类名还是原始的无哈希名称，导致选择器完全匹配不上。
• 样式导入顺序错误：要是你先导入了自定义CSS，再导入Quill的官方CSS，Quill的样式会覆盖你的自定义样式。必须保证自定义样式在Quill CSS之后引入。
• React样式隔离机制限制：如果使用了CSS-in-JS方案（如Styled Components），或者Quill被包裹在Shadow DOM中，全局类选择器无法穿透隔离作用到Quill的DOM结构，而ID选择器不受此限制。
• 选择器书写不匹配：检查你的类选择器是否和Quill实际生成的DOM结构一致，比如Quill的编辑器容器默认类是.ql-container，如果误写成.container就会匹配失败。

内容的提问来源于stack exchange，提问作者senseiwa