我的 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 包括:
导入'./App.css';
我使用 CSS:
.body {
background-color: "green"
}
并且主体不会变为绿色。
如何修改 CSS?我还尝试将 app.css 放入 public/app.css 并加载链接 rel="stylesheet"元素检查器仍然显示没有效果。
元素检查器显示来自“用户代理样式表”的 body 元素上有 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>
没有效果。
最佳答案
您正在使用 .body
它正在寻找具有“body”类的元素 - 因为有一个 .
将其更改为 body
(没有 .
)并且它将为 body 元素而不是类设置样式。
此外,CSS 中的命名颜色不是可变字符串 - 因此请删除引号:
body {
background: green;
}
值得将您的样式放回 App.css 并在 JS 中导入它,而不是使用 <style>
标签。
关于css - 在 create-react-app 中更改 App.css 不影响页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48493261/