h1标签的背景颜色在reactjs中不起作用

【问题标题】：background color of h1 tag not working in reactjsh1标签的背景颜色在reactjs中不起作用
【发布时间】：2021-10-28 22:52:00
【问题描述】：

import React from 'react'


export default function Home(){

return<div>

<h1 className="bg-dark text-white p-3">Home</h1>

 </div>
 }

我想更改 h1 标签的背景颜色，但不能在 react 和 bootstrap 中工作成功导入，我也测试了适合我的按钮。有没有给我提示一下？

【问题讨论】：

您是否正确导入了引导 CSS？它是否适用于其他类型的类？

标签： javascript css reactjs bootstrap-4

【解决方案1】：

您拥有的类是用于容器的

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<div class="p-3 mb-2 bg-dark text-white">
  <h1>Home</h1>
</div>

或者使用css

.whiteonblack {
  color: white;
  background-color: black;
}

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<div>
  <h1 class="whiteonblack">Home</h1>
</div>

【讨论】：