为什么我的样式无法在codeandbox中生效？

Question

如果您查看这个很小的CodeSandbox项目：https://codesandbox.io/s/0oj4z7ko00

在index.html中注意以下两个摘要：

<style type="text/css">
  #container {
    background: yellow;
  }
</style>

和

<div id="container"></div>

这个容器是React渲染应用程序其余部分（有效）的地方，但是它的背景不是黄色！为什么不呢？

---

此外，如果您查看components / Presentational.js，则会发现以下代码段：

<div className={data % 2 === 0 ? "even" : "odd"}>

以及在index.html中，这些类名称的某些样式：

<style type="text/css">
  .even { color: red; }
  .odd { color: green; }
</style>

请注意，类名是根据data道具的值正确分配给元素的，但是样式没有生效，文本仍为黑色。

在两种情况下，样式都无法在检查器中找到，因此我真的不认为它们会被覆盖。但是到底发生了什么？为什么我的样式在CodeSandbox中不起作用？

Answer 1

在完成任何更改后保存该文件，例如保存 HTML、CSS、.jss 文件。

点击文件选项卡（左上角）-> 保存