如何更改HTML页面的背景色？安装库

我正在使用React.js，希望更改整个页面的背景色。我想不出怎么做这件事。请帮帮忙，谢谢。

编辑(9月2；18)：我在GitHub上有一个项目，我在这里链接。我现在没有这个项目在线，但是在/client文件夹中是客户端服务器。快看啊。我就是这样回答这个问题的。

最简单的解决方案有点老套，但您可以使用raw javascript修改正文样式：

更干净的解决方案可能是使用像react-helmet或next.js head组件这样的主管管理器。

从'；Reaction；导入{Helmet}从'；React-Helmet'；；类应用程序扩展React.Component{Render(){Return(<；div className="；Application"；&>；<；Helmet&>；<；Style&>；{'；Body{Background-color：Red；}<；}<；/style&>t；<。}}；

最后，有很多工具可以提供更干净的方式来处理这个问题。但是如果你不想依赖第三方，原始的JS选项可能就足够好了，如果你不让它太互动的话。

我可以从reactjs组件中获取文档吗？我现在正试着做这件事，但没有任何运气。文件只是回来时没有定义-伊森·戴维斯(Ethan Davis)。

@Ethan Davis文档是浏览器中的全局变量；您可以从任何地方访问它。-西蒙·布德里亚斯(Simon Boudrias)

我要从NodeJS服务器呈现我的反应。文档未为我定义--伊森·戴维斯(Ethan Davis)。

@Ethan Davis，那么答案将非常具体，取决于您是如何构建服务器端的。但是同样的概念仍然成立；您希望使用原始JS来处理这一点，因为Reaction不会呈现<；body>；标记。-西蒙·布德里亚斯(Simon Boudrias)。

@DaveHowson的原因是手动操作文档需要您手动处理清理/更新。因此，它不是理想的，因为它更容易出错，需要更多的人工工作。这就是说，这是一个有效的用例，并且RESPECT并不会使其难以实现。因此，我会说，如果您还没有使用使文档更容易的框架/库，那么操作文档是可以的。-西蒙·布德里亚斯(Simon Boudrias)。

这是一个非常硬编码的解决方案，与其他主题非常不同。不太好。-Doublejosh。

上面的解决方案讲述了如何添加外部库以提供所需的功能，但是您可以做的只是转到Index.css文件，并在已经写入的标记body中放置"；Background-color：'；color'；"；然后就完成了。

最简单的解决方案！：useEffect(()=>；{Docent.body.style.backround Color='；red'；}，[])-Yannuth。

在互联网上搜索了一段时间后，我在一个现已弃用的GitHub回购上找到了这个解决方案：

我只是摆弄了一会儿这个。对我来说很简单的解决方案，并不完全直观，全部公开/index.html：

一个问题的两个条目，但它都在一个文件中，不需要新的库，似乎可以工作。

const Changeback=()=>；{const style Obj={Background："；green"；}；return(<；div id="；hello-world"；style={style esObj}className="；tainer"；<；<；/div>；)}导出默认更改背景；//ReactDOM.ender(<；Changeback/>；，

.容器{位置：固定；宽度：100%；高度：100%；z-index：-10；文本对齐：居中；过渡：全部500ms缓动；}。

//在css文件中。Background-White{Background-Color：White！Important；}//在您的Reaction组件中DidMount(){document.body.classList.add("；background-white"；)；}componentWillUnmount(){document.body.classList.remove("；background-white"；)；}。

如果将Reaction与Bootstrap一起使用，只需在index.html文件中的<；body>；标记中包含一个背景色Bootstrap类，如下所示：

您可以在Reaction中使用CSS模块。以下是名为Home.js的文件的Javascript代码。

从'；./Home.module e.css'；；const Home=()=>；{return(<；div className={Style}>；<；/div>；)；}导入样式。}导出默认主页；

在名为Home.module e.css(格式为[name].module e.css)的CSS模块中，输入以下内容，您的页面的背景颜色将为蓝色

创建一个ID为Wrapper"；的包装器组件网，然后创建具有颜色状态的样式：

getInitialState：function(){return{color："；White"；}；//设置初始状态的颜色。}，changeColor：function(){this.setState({color："；Black"；})；//设置更改后的颜色。}，Render：function(){var style={backround Color：this.state.color}；//包装器(根)组件return(<；div id="；a onClick={this.changeColor}>；change<；/a>；<；/div>；)；}。

我已经有一段时间没有问这个问题了。从那时起，我开始做的事情就是使用Facebook的创建-反应-应用程序设置，并直接编辑CSS文件。

这并没有真正回答如何更改正文背景色的问题。您刚才说您是如何创建样板的，并且您正在直接编辑CSS文件。这并没有真正解释你使用什么CSS来做这件事(我相信有不止一种方式)，哪些文件，你如何获得对身体的引用，等等。我希望我听起来不像个混蛋，只是没有找到非常有描述性的答案。我使用@Reni的答案Tmin让它正常工作。

点击“发布您的答案”，即表示您同意我们的服务条款、隐私政策和Cookie政策。

不是你想要的答案吗？浏览标记的其他问题或提出您自己的问题。