Есть ли класс wrapper для bootstrap?

243
19 декабря 2017, 16:30

Есть ли в bootstrap обертка (wrapper) для странички(HTML)?
Может быть неправильно задал вопрос, но мне нужно сделать общий padding для странички.

Answer 1
  1. У бутстрапа нет общей обертки.

  2. Если вы хотите задать вертикальный внутренний отступ, то спокойно можете добавить его к body.

  3. Если вы хотите задать горизонтальный отступ:

a) Если вы планируете сделать отступ больше чем половина gutter, то можете просто добавить эти отступы для container. В 4 бутстрапе только для отступов есть отдельные классы. Таким образом вы можете обойтись только средствами бутсрап:

span { 
  display: block; 
  padding: 5px; 
  margin-top: 5px; 
  border: 1px solid #ddd; 
  background: #eee; 
}
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous"> 
 
<div class="container pl-5 pr-5"> 
  <div class="row"> 
    <div class="col"> 
      <span>1 of 2</span> 
    </div> 
    <div class="col"> 
      <span>2 of 2</span> 
    </div> 
  </div> 
  <div class="row"> 
    <div class="col"> 
      <span>1 of 3</span> 
    </div> 
    <div class="col"> 
      <span>2 of 3</span> 
    </div> 
    <div class="col"> 
      <span>3 of 3</span> 
    </div> 
  </div> 
</div>

б) Можно поменять в переменных основной отступ - тогда изменятся паддинги у контейнера, маргины у row, и паддинги у col и соответсвенно изменится отступ между колонками. В третьем бустрапе для этого можно воспользоваться кастомизатором.

в) Если вы планируете сделать отступ меньше чем половина gutter и оставить прежнее расстояние между колонками, тогда можно обернуть содержимое во wrapper c отрицательным оступом и добавить странице горизонтальный overflow, тогда следует помнить, что содержимое может обрезаться и чуть внимательнее отненстись к этому при тестировании.

г) Так же в бустрапе есть возможность делать колонки без отступа .no-gutter - тогда ваши паддинги у контейнера могут быть любой ширины.

Answer 2

Судя по поиску его там нет, вы это можете проверить простым поиском в файлах bootstrap. Остаётся только создать самому.

Answer 3

Работая с bootstrap 3 и 4, wrapper не встречал.
У вас есть два пути:
- первый, это использовать ресурсы самого фреймворка и делать из того что есть (а с теми классами спокойно можно реализовать вашу задумку);
- или же второй, это реализовать все самому через свой отдельный файл css.

READ ALSO
Javascript/JQuery добавить class к каждому элементу внутри tr таблицы

Javascript/JQuery добавить class к каждому элементу внутри tr таблицы

Подскажите, как добавить для такой таблицы для каждого элемента <tr class="tr_elem"> добавить класс openНо добавить только к рамках текущего `

278
Как сделать что бы бд добавила один раз

Как сделать что бы бд добавила один раз

Есть таблица table и есть колона colmКак сделать так что бы при нескольких добавлениях в бд

211