react.js中使用react-bootstrap时,怎样自定义样式

发布于 2022-09-04 21:15:31 字数 1088 浏览 9 评论 0

现在需要在使用react的项目中使用bootstrap并且对其的一些基本样式进行更改,应该如何实现呢。

比如(更改按钮的背景颜色):

clipboard.png

这个生成的按钮,其代码如下:

clipboard.png

而其运行后生成的代码为

clipboard.png

其背景颜色是在a标签的属性

clipboard.png

而如果我在其样式上添加颜色属性

clipboard.png

其改变的是父元素的属性,而子元素继续保持不变,那么我应该如何实现更改按钮的背景颜色呢。

clipboard.png

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

澉约 2022-09-11 21:15:31

如果要改全部button的样式,直接写

.nav-pills > li.active > a {
    background-color: #FFF;
    color: #000;
}

覆盖掉默认的bootstrap button样式, 如果只想更改某一个地方的,就在Nav外面套一层父元素,加一个class,如:

.parent > .nav-pills > li.active > a {
    background-color: #FFF;
    color: #000;
}
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文