如何使用引导程序对ReactJS组件进行样式设置

Question

我刚刚开始使用引导程序，并且很难找到有关样式化React Bootstrap组件的任何信息。我在一些文本上测试了一个简单的文本对齐方式，似乎可以正常工作，但是我无法更改组件的宽度和高度。

import React from 'react';
import { Card, Button  } from 'react-bootstrap';
import { NavLink } from "react-router-dom";


const CarItem = () => {
    return ( 
        <Card styles={styles.card}>
            <Card.Header as="h5">Featured</Card.Header>
            <Card.Img src="holder.js/100px180" />
            <Card.Body style={styles.body}>
                <Card.Title>Special title treatment</Card.Title>
                <Card.Text>
                With supporting text below as a natural lead-in to additional content.
                </Card.Text>
                <NavLink activeClassName="active" to="/carPage">USER PAGE</NavLink>
            </Card.Body>
        </Card>
     );
}

export default CarItem;

const styles = {
    card: {
        height: 80,
        width: 80,
    },
    body: {
        paddingLeft: '3px',
    }
}