Reactjs 无法在React中使用CSS属性

我使用了

npx create react app

来设置工作空间。然后，我删除了src目录中的所有文件，从头开始编写。我创建了几个组件，其中一个组件如下：

import React from "react";

function AwesomeHeader() {
  return (
    <span>
      <input type="checkbox"></input>
      <p className="span-class">Do you like this Awesome header ?</p>
    </span>
  );
}

export default AwesomeHeader;

---

怎么了？

你在App.js中导入了.css文件吗？

你必须将style.css文件添加到index.js文件中。 如果style.css文件具有与index.js相同的目录，则应添加以下内容

import './style.css'

---

对于index.js文件

您尚未在组件文件中导入style.css文件，请尝试添加一条将向组件添加样式的导入语句。您需要导入css文件，如

import./style.css'

。未导入css文件

import React from "react";
import ReactDOM from "react-dom";
import App from "./App";

ReactDOM.render(<App />, document.getElementById("root"));

.span-class {
  background-color: red;
  color: white;
}

import './style.css'