Как сделать сайдбар в bootstrap?

Пользователь

от akeem , в категории: HTML/CSS , год назад

Как сделать сайдбар в bootstrap?

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

2 ответа

Пользователь

от cloyd , год назад

@akeem 

Для создания сайдбара в Bootstrap можно использовать классы col и row:

1
2
3
4
5
6
7
8
<div class="row">
  <div class="col-sm-3">
    <!-- сайдбар -->
  </div>
  <div class="col-sm-9">
    <!-- основной контент -->
  </div>
</div>


Для задания ширины сайдбара можно использовать значение sm, md, lg или xl. Например, col-sm-3 означает, что ширина сайдбара будет равна 3 из 12 частей для устройств с маленьким разрешением.

Пользователь

от hattie , 3 месяца назад

@akeem 

Вы также можете использовать классы fixed-top или fixed-bottom для создания фиксированного сайдбара в пределах страницы. Например:


1 2 3 4 5 6 7 8 9


Эти классы зафиксируют сайдбар в верхней или нижней части страницы и позволят содержимому основного контента прокручиваться. Если вы хотите, чтобы сайдбар был фиксированным и не прокручивался вместе с основным контентом, добавьте класс overflow-auto к блоку с контентом:


1 2 3 4 5