从引导程序3中的select标记删除边框半径
这似乎是一个微不足道的问题，但我无法弄清楚。
在引导自己的网站，他们有select的例子。
看看这个代码，看起来这个select元素的边界半径为4。 
我的希望是，将边界半径改为0将从select元素中移除边界半径，但情况并非如此，如下图所示。
我已经探索了所有改变select元素的CSS，但似乎没有删除边界的半径。
除了border-radius: 0之外，还要加上-webkit-appearance: none; 。
这是一个适用于所有现代浏览器的版本。 关键是使用appearance:none删除默认格式。 由于所有的格式都没有了，所以你必须重新添加箭头，以便从input中区分select。
工作示例： https ： //jsfiddle.net/gs2q1c7p/
select:not([multiple]) { -webkit-appearance: none; -moz-appearance: none; background-position: right 50%; background-repeat: no-repeat; background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAMCAYAAABSgIzaAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx/PuGsgwQAAAA5SURBVHjaYvz//z8DOYCJgUxAf42MQIzTk0D/M+KzkRGPoQSdykiKJrBGpOhgJFYTWNEIiEeAAAMAzNENEOH+do8AAAAASUVORK5CYII=); padding: .5em; padding-right: 1.5em } #mySelect { border-radius: 0 }
<select id="mySelect"> <option>Option 1</option> <option>Option 2</option> </select>
我有同样的问题，虽然user1732055的答案解决了边界，它删除下拉箭头。 我解决了这个问题，通过删除select元素的边界，并创build一个具有边框的包装span 。
HTML：
<span class="select-wrapper"> <select class="form-control no-radius"> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select> </span>
CSS：
select.no-radius{ border:none; } .select-wrapper{ border: 1px solid black; border-radius: 0px; }
使用从@ArnoTenkink的SVG作为一个数据url结合接受的答案，这给了我们视网膜显示的完美解决scheme。
select.form-control:not([multiple]) { border-radius: 0; appearance: none; background-position: right 50%; background-repeat: no-repeat; background-image: url(data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%20%3C%21DOCTYPE%20svg%20PUBLIC%20%22-//W3C//DTD%20SVG%201.1//EN%22%20%22http%3A//www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd%22%3E%20%3Csvg%20version%3D%221.1%22%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20xmlns%3Axlink%3D%22http%3A//www.w3.org/1999/xlink%22%20x%3D%220px%22%20y%3D%220px%22%20width%3D%2214px%22%20height%3D%2212px%22%20viewBox%3D%220%200%2014%2012%22%20enable-background%3D%22new%200%200%2014%2012%22%20xml%3Aspace%3D%22preserve%22%3E%20%3Cpolygon%20points%3D%223.862%2C7.931%200%2C4.069%207.725%2C4.069%20%22/%3E%3C/svg%3E); padding: .5em; padding-right: 1.5em }
这个class被称为：
.form-control { border-radius: 0; }
请确保在包含引导CSS后插入覆盖。
如果您只想在select的表单控件上使用半径删除
select.form-control { ... }
代替
编辑：为我在铬，火狐，歌剧和Safari浏览器，IE9 +（所有在Linux上运行/ safari＆playonlinux上的IE浏览器）
