Css 更改React引导选项卡的：活动背景色

我对bootstrap还不熟悉，但我的反应有点流利。我只想问一下如何更改react引导选项卡的：活动背景颜色

这是链接：-（它是垂直选项卡菜单）

我使用了上面显示的代码

                   <Tab.Container id="sidebar" defaultActiveKey="first">
                        <Row>
                            <Col sm={3}>
                            <Nav variant="pills" className="flex-column">
                                <Nav.Item>
                                    <Nav.Link eventKey="first" className="tab">Tab 1</Nav.Link>
                                </Nav.Item>
                                <Nav.Item>
                                    <Nav.Link eventKey="second" className="tab">Tab 2</Nav.Link>
                                </Nav.Item>
                                <Nav.Item>
                                    <Nav.Link eventKey="third" className="tab">Tab 3</Nav.Link>
                                </Nav.Item>
                            </Nav>
                            </Col>
                            <Col sm={9}>
                            <Tab.Content>
                                <Tab.Pane eventKey="first">
                                    <h1>One</h1>
                                </Tab.Pane>
                                <Tab.Pane eventKey="second">
                                    <h1>Two</h1>
                                </Tab.Pane>
                            </Tab.Content>
                            </Col>
                        </Row>
                    </Tab.Container>

表1
表2
表3
一个
两个

如何使用CSS或引导更改活动选项卡的背景

请帮忙

---

谢谢。

正如@Tim所建议的，当您选择

variant=“pills”

时，它也是100%正确的，但默认值是

variant=“tabs”

用于选项卡

.nav.nav-pills .nav-link.active {
    background-color: <YOUR_COLOR>
}

.nav.nav-tabs .nav-link.active {
    background-color: <YOUR_COLOR>
}

.nav.nav-pills.nav-link.active{
背景色：
}

用于药片

.nav.nav-pills .nav-link.active {
    background-color: <YOUR_COLOR>
}

.nav.nav-tabs .nav-link.active {
    background-color: <YOUR_COLOR>
}

.nav.nav-tabs.nav-link.active{
背景色：
}

.nav pills.nav-link.active{背景色：红色；}

？哦，我在发布之前没有看到你的评论