Question

我的React的index.js，我使用了create-react-app启动项目。

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

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

我的app.js包括：

导入＆＃39; ./ App.css＆＃39;;

我使用CSS：

.body {
  background-color: "green"
}

并且身体不会变为绿色。

如何修改CSS？我也尝试将app.css放入public / app.css并使用link rel =＆＃34; stylesheet＆＃34;元素检查员仍然没有显示效果。

元素检查器显示来自＆＃34;用户代理样式表＆＃34;的身体元素的8px边距...我的加载的CSS没有任何内容。

编辑：

我也尝试使用内联样式标记：

<!doctype html>
<html lang="en">
<script src="web3.js"></script>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
    <title>CryptoClicker</title>
  </head>
  <body>
    <div id="root"></div>

  </body>
  <style>
  .body {
    background: "green";
  }
  </style>
</html>

没效果。

Answer 1

您正在使用.body正在寻找类＆＃39; body＆＃39; - 因为.将body更改为.（没有body { background: green; }），并且它会对主体元素而不是类进行设置。

此外，CSS中的命名颜色不是变量字符串 - 因此请删除引号：

<style>

值得将您的样式重新放入App.css并将其导入JS而不是使用{{1}}标记。

更改create-react-app中的App.css不会影响页面

1 个答案: