如何更改 Bootstrap 按钮样式？比如改成直角。。。

Question

网站开发规划中......
觉得 Bootstrap 有很多优秀之处，同时对于满大街的 Bootstrap 超级审美疲劳，尤其是我乃Metro 风格（是北欧极简，不是微软风格）支持者。
吐槽完毕，进入正题：请问如何修改按钮的样式？

Answer 1

bootstrap的CSS是用LESS编译的，面对一个编译过后的框架型项目，不建议：

• 增加权重更高的CSS规则，覆盖原有的（包括使用!important来强制复写）
• 增加class/id，改变你的DOM属性，然后自己写CSS规则

这样会大大增加你自己的CSS（如果有的话）和CSS框架的耦合度，也会让代码变得越来越多，失去可维护性。

CSS源自哪里，就从根源处解决：下载LESS源文件，然后搜索border-radius属性，把它全部去掉。然后重新编译CSS。

P.S.jQuery Mobile的CSS样式同理。我曾经维护原来同事的一堆复写JQM框架的样式维护得吐血。

Answer 2

可能这个有效

http://bootswatch.com/yeti/

Answer 3

找到bootstrap.min.css下border-Radius属性，将其改为：border-Radius="0px"；

Answer 4

http://v3.bootcss.com/customize/

Answer 5

TODC Bootstrap
A Google-styled theme for Bootstrap.
http://todc.github.io/todc-bootstrap/

Answer 6

bootmetro: http://aozora.github.io/bootmetro/

Answer 7

新建一个button样式，把默认的覆盖掉嘛

Answer 8

定义直角很简单的 border-Radius="0px".
或者部分直角 border-top-right-radius , border-bottom-right-radius

握手一下我也很讨厌圆角。WE are not 2 B squre ^^

Answer 9

之前就是通过加!important强制修改样式。
正确做法是：下载less源码，修改你要修改的部分。或者是直接在官网上定制你要的样式。