怎样改变bootstrap的样式

2025-05-10 13:01:22
推荐回答(1个)
回答1:

  bootstrap已经作为前端开发必不可少的框架之一,应用bootstrap使得我们对布局、样式的设定变得非常简单。
  但bootstrap提供的默认样式往往不能满足我们的需求,从而定制化bootstrap成为我们经常需要做的工作,本文就如何更高效更可维护地定制bootstrap做一下探讨。
  
  如下图,在你的button 中加入bootstrap的class: btn btn-primary,就可以将默认的button(左边)变成右边的样式。

  可如果我们想应用自己的样式呢?比如我们想要拥有圆角的button。
  通常,我们可以直接覆盖bootstrap的样式。
  我们在自己的项目目录下新建my-custom.css文件,加入如下代码:
  .btn { -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px;}