摆脱Twitter Bootstrap中的所有圆angular
我喜欢Twitter的Bootstrap 2.0 – 我喜欢它是如此完整的图书馆…但我想做一个非常非四四不变的网站，这是摆脱Bootstrap中的所有圆angular的全球修改…
这是很多CSS来突破。 是否有全局切换，或者find并replace所有舍入的最好方法是什么？
我将所有元素的边界半径设置为“0”像这样：
* { border-radius: 0 !important; } 因为我确定我不想在稍后覆盖这个，我只是使用！重要的。
如果你没有编译less量的文件，只需要：
* { -webkit-border-radius: 0 !important; -moz-border-radius: 0 !important; border-radius: 0 !important; }
在引导程序3中，如果正在编译它，现在可以在variables.less文件中设置半径：
@border-radius-base: 0px; @border-radius-large: 0px; @border-radius-small: 0px;
在引导程序4中，如果正在编译它，则可以在_custom.scss文件中一起禁用半径：
$enable-rounded: false;
下载源代码.less文件并将.border-radius()混合为空。
如果您正在使用Bootstrap版本<3 …
用sass / scss
$baseBorderRadius: 0;
less用
@baseBorderRadius: 0;
在导入引导程序之前，您需要设置此variables。 这将影响所有的井和navbars。
更新
如果使用的是Bootstrap 3 baseBorderRadius应该是border-radius-base
如果你想避免重新编译所有的东西，只需添加.btn {border-radius: 0;}到你的CSS。
code, kbd, pre, .img-rounded, .img-thumbnail, .img-circle, .form-control, .btn, .btn-link, .dropdown-menu, .list-group-item, .input-group-addon, .input-group-btn, .nav-tabs a, .nav-pills a, .navbar, .navbar-toggle, .icon-bar, .breadcrumb, .pagination, .pager *, .label, .badge, .jumbotron, .thumbnail, .alert, .progress, .panel, .well, .modal-content, .tooltip-inner, .popover, .popover-title, .carousel-indicators li { border-radius:0 !important; }
当使用Bootstrap> = 3.0源文件（ SASS或LESS ）时，如果只有一个元素正在窃听你，那么你不必去掉所有的圆angular，例如，去掉圆angular导航栏，使用：
SCSS：
$navbar-border-radius: 0;
随着LESS：
@navbar-border-radius: 0;
但是，如果你想摆脱所有的圆angular，你可以做什么@ adamwong246提及和使用：
$baseBorderRadius: 0; @baseBorderRadius: 0;
这两个设置是“根”设置，其他设置像navbar-border-radius将从中inheritance，除非指定了其他值。
对于一个列表，所有variables检查出variables.less或variables.scss
.btn { border-radius: 0px; -webkit-border-radius: 0px; -moz-border-radius: 0px; }
或者定义一个混音，并将其包含在任何你想要的地方。
@mixin btn-round-none { border-radius: 0px; -webkit-border-radius: 0px; -moz-border-radius: 0px; } .btn.btn_1 { @inlude btn-round-none }
以上由@BrunoS张贴的代码不适合我，
* { .border-radius(0) !important; }
我用的是
* { border-radius: 0 !important; }
我希望这可以帮助别人
有一个非常简单的方法来定制Bootstrap：
- 只需转到http://getbootstrap.com/customize/
- find所有的“半径”，并根据需要修改它们。
- 点击“编译和下载”，享受你自己的Bootstrap版本。
你也可以看看FlatStrap 。 它为Bootstrap CSS提供Metro-Style替代，无需使用圆angular，渐变和阴影。
这个问题是相当古老的，但它在search引擎甚至在Bootstrap 4相关的search是高度可见的。 我认为值得添加一个答案，禁用圆angular，BS4的方式。
在_variables.scss ，有几个全局修改器可以快速更改诸如启用或禁用Flex网格系统，圆angular，渐变等的内容：
$enable-flex: false !default; $enable-rounded: true !default; // <-- This one $enable-shadows: false !default; $enable-gradients: false !default; $enable-transitions: false !default;
圆angular是默认enabled的。
如果你喜欢使用Sass和你自己的_custom.scss （或使用官方定制器）来编译Bootstrap 4，覆盖相关的variables就足够了：
$enable-rounded : false
或者你可以添加到你想要删除边界半径的元素的HTML（这样你就不会从所有的button/元素中删除它）：
style="border-radius:0px; -webkit-border-radius:0px; -moz-border-radius:0px;"
我创build了另一个css文件并添加下面的代码并不是所有的元素都包含在内
/* Flatten das boostrap */ .well, .navbar-inner, .popover, .btn, .tooltip, input, select, textarea, pre, .progress, .modal, .add-on, .alert, .table-bordered, .nav>.active>a, .dropdown-menu, .tooltip-inner, .badge, .label, .img-polaroid, .panel { -moz-box-shadow: none !important; -webkit-box-shadow: none !important; box-shadow: none !important; -webkit-border-radius: 0px !important; -moz-border-radius: 0px !important; border-radius: 0px !important; border-collapse: collapse !important; background-image: none !important; }
