Можно ли использовать Bootstrap без использования всего стиля?
Есть ли простой способ использовать Bootstrap в существующем проекте?
В настоящее время он добавляет стили для таблицы, и т.д., которая испортит все на странице.
Мне очень нравится модальное окно, некоторые кнопки, но я не хочу постоянно останавливать загрузку css, чтобы переключать элементы обратно в стили по умолчанию.
Ответы
Ответ 1
Вы можете использовать функцию "настроить" на веб-сайте начальной загрузки, чтобы получить только те функции, которые вы хотите: Страница загрузки загрузочной страницы Twitter. Большинство правил загрузки являются явными. Вероятно, вы хотите оставить только те правила reset, которые по умолчанию неявны.
Ответ 2
Bootstrap 3//Менее 1.4.0:
После выхода Bootstrap 3 и Less 1.4.0 bootstrap начал использовать псевдо-селектор :extend()
. Это означает, что в исходном коде, который я опубликовал, некоторые вещи потерпят неудачу (вы получите код .bscnt .bscnt form-horizontal
, который означает, что вам нужно вложить два div внутри eachother, что просто глупо). Самый простой способ исправить это - удалить первые две строки из bootstrap.less
(@import variables.less
и @import mixins.less
) и вместо этого импортировать эти файлы вне области .bs-cnt
:
@import "variables.less";
@import "mixins.less";
.bscnt {
@import "bootstrap.less";
}
Вы также можете скачать bootstrap отсюда: Источник начальной загрузки, а затем введите каталог "less" и добавьте файл под названием "bootstrap-custom.less", введите следующий контент:
.bs-cnt {
@import "bootstrap.less";
}
"bs-cnt" для BootStrap-CoNTainer. Вы можете сделать это дольше, если хотите, но помните, что он будет вставлен во множество мест в скомпилированном CSS, чтобы он сохранял место в конечном файле.
После того, как вы это сделали, просто скомпилируйте файл bootstrap-custom.less с вашим любимым меньше компилятором (SimpLESS довольно хорошо, если вы на Windows), а затем у вас будет скомпилированный файл начальной загрузки, который будет работать только при размещении элемента контейнера с классом "bs-cnt".
<div class="bs-cnt">
<button class="btn btn-success btn-large">This button will be affected by bootstrap</button>
</div>
<button class="btn btn-danger">This however; Won't</button>
Ответ 3
Я думаю, что ссылка в разделе ответов еще не обновлена. Здесь вы можете настроить свой Bootstrap непосредственно на сайте GetBootstrap:
Настроить и загрузить - GetBootstrap