reactjs - 在 React BootStrap 中的行元素之间添加空格

我是 React 和 react-bootstrap 的新手。我有一个 Row 组件,想要在屏幕顶部和各个行元素之间留出间距。我目前正在编辑它的 CSS,但听说乱用框架的 CSS 可能不好?

const Styles = styled.div`
  .background {
    background: url(${backgroundImage}) no-repeat fixed bottom;
    background-size: cover;
    height: 100vh;
    position: relative;
  }

  #row {
    position: relative;
    top: 200px;
  }
`;

class Signup extends React.Component {
  render() {
    return (
      <Styles>
        <div className="background">
          <Container>
            <Row id="row" className="justify-content-md-center">
              <ExtraInfo />
              <SignupForm />
            </Row>
          </Container>
        </div>
      </Styles>
    );
  }
}

export default Signup;

最佳答案

在 React-Bootstrap 中使用 Form.Group。它在列上添加 15px 的填充以分隔列的内容。

https://stackoverflow.com/questions/57832572/

相关文章:

angular - 如何修复 "Could not determine the dependenci

reactjs - GraphQL 返回数据但在代码中未定义

jpa - Spring Data JPA Projection嵌套列表投影接口(interface

wordpress - 在自定义感谢页面上显示 Woocommerce 订单详细信息

python - 如何输入泛型函数?

reactjs - ThemeProvider/Typescript 错误 : Types of p

java - DynamoDB 排序键的多重比较条件?

angular6 - 无法在 'getUserMedia' : At least one of au

amazon-web-services - 解码 AWS session token

angular - 使用 ngx-image-cropper 在单个图像上使用多个裁剪框