为什么React项目需要在组件范围内继承CSS模块作为背景？
P粉161939752
2023-08-10 17:05:31
<p>我创建了一个React组件，但出现了一个问题，整个网站都继承了我在一个CSS模块中设置的body样式。我尝试了使用和不使用local标签，我觉得这可能与React包装CSS模块的方式有关，因为我没有看到其他人有同样的问题。</p>
<pre class="brush:php;toolbar:false;">:local body
{
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
background: #300d25;
transition: 0.5s;
}
:local body::before
{
content:'';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: #30bfa5;
transition: 0.5s;
clip-path: circle(250px at center);
}</pre>
您已经创建了一个带有关联CSS模块的React组件，但您在其中一个CSS模块中定义的样式似乎影响了整个网站而不只是组件。此问题可能是由于CSS模块的错误使用、类名冲突、全域样式、拼写错误、浏览器扩展或CSS特异性问题引起的。要解决此问题，请确保正确使用CSS模块的命名和使用方法，检查冲突和拼写错误，审查全域样式，使用CSS复位或标准化，检查应用的样式，并验证您的Webpack配置。如果问题仍然存在，请考虑提供更多详细信息以进行特定的故障排除。