Как сделать кнопки без круглых углов в Twitter Bootstrap?

Question

[Stan_1]

Добрый день,

прошу подсказать начинающему, как наименьшими усилиями, и наиболее "родным" способом сделать в Twitter Bootstrap кнопки и input-поля без закругленных углов и без градиента? Все что нашел - это прямая правка CSS. Так и должно быть или есть более прямой способ?

Спасибо!

Answer 1

[Lorem Ipsum]

Создаете файл main.css с содержимым

.br0 {
    border-radius: 0px !important;
}

Дальше делаете подключение ПОСЛЕ css twitter bootstrap.

В коде пишите вот так

<span class="btn btn-default br0">Bootstrap</span>

Пример на JsFiddle

Вообще, изменять less стоит только если надо железно сделать кнопки квадратными, в общем же случае, мой вариант куда практичнее.

Comments

[Stan_1]

Спасибо большое!

[Евгений]

вообще не важно где подключается, до или после если есть !important. Но по мне так легче поправить sass файл, чтобы лишний тег потом не добивать постоянно, или ещё проще если нужно все кнопки "спрямить" и не умеешь sass файл править и компилировать, добавить вначале любого css файла, подключаемого к документу:

.btn {
border-radius: 0px !important;
}

Answer 2

[Виталий Бобров]

прямее правки css, а в случае с бутстрапом less или sass нету) ищите input-ы и их свойства border-radius и linear-gradient

Answer 3

[Евгений Комаров]

Способ всегда есть - изменяете параметр в .less|scss файлах. За скругление углов отвечают переменные, определенные в variables.less

@border-radius-base
@border-radius-large
@border-radius-small

Стилизация полей ввода, как и любых других элементов также вынесена в отдельные файлы, так что найти их не составит большого труда.