reactjs - 如何更改 React bootstrap col 中 <h1> 的字体大小？

Question

我正在导入一个 css 文件(app.css)来设置 <h1> 的样式字体。这是我的 app.css 文件中的内容:

.h1 {
  font-size: 100px !important;
}

这是我尝试渲染的 react 引导列。它渲染在页面上，但是字体大小为h1没有改变。

import React from "react";
import "../App.css";
import { Container, Row, Col } from "react-bootstrap";

function HowItWorks() {
  return (
    <Container className="text-center HowItWorks">
      <Row className="mt-5">
        <Col xs={12} md={4}>
          <h1>Create Account</h1>
        </Col>
      </Row>
    </Container>
  );
}

export default HowItWorks;

Answer 1

尝试使用内联 JSX 样式对象。注意驼峰式的情况:

<h1 style={{ fontSize: "5rem" }}>Create Account</h1>