Перейти к содержимому


Внимание!

На форуме можно зарегистрироваться в два клика, используя социальную сеть Вконтакте. Для этого нажмите сюда.


Фотография

Вертикальное расположение кнопок


  • Авторизуйтесь для ответа в теме
Сообщений в теме: 4

#1 Тиша

Тиша

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

  • Пользователи
  • PipPip
  • 23 сообщений

Отправлено 01 Декабрь 2016 - 21:57

Очень нужно сделать чтобы на бутстрапе кнопки отображались не горизонтально а вертикально. Знаете ли вы решение, сами придумали или даже готовое решение для этого есть?



#2 Добрынин

Добрынин

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

  • Пользователи
  • PipPip
  • 22 сообщений

Отправлено 01 Декабрь 2016 - 22:24

<div class="btn-group-vertical">
  ...
</div>

Вот так и делается. С кнопками в Bootstrap вообще можно чудить как угодно.  Я сам бы рад ознакомится с различными дополнительными эффектами для кнопок, в том числе как делать кнопки разной формы и размеров если можно.



#3 kertov

kertov

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

  • Пользователи
  • PipPip
  • 25 сообщений

Отправлено 01 Декабрь 2016 - 23:54

<div class="btn-group-vertical">
  ...
</div>

Вот так и делается. С кнопками в Bootstrap вообще можно чудить как угодно.  Я сам бы рад ознакомится с различными дополнительными эффектами для кнопок, в том числе как делать кнопки разной формы и размеров если можно.

 

Если говорить о стилях кнопок то для того чтобы кнопка отображалась в соответственном стиле нужно чтобы  для не был прописан один из стилей:


    .btn-default
    .btn-primary
    .btn-success
    .btn-info
    .btn-warning
    .btn-danger
    .btn-link



#4 Романов

Романов

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 30 сообщений

Отправлено 02 Декабрь 2016 - 00:39

Для стиля кнопки один класс, а для размера другой. По стилю нужно прописать так:

<a class="btn btn-default" href="#" role="button">Кнопка</a>
<button class="btn btn-default" type="submit">Кнопка</button>
<input class="btn btn-default" type="button" value="Кнопка">

Ну а если по размеру то например:

<button type="button" class="btn btn-primary btn-lg">Большая</button>
<button type="button" class="btn btn-primary btn-md">Средняя</button>
<button type="button" class="btn btn-primary btn-sm">Маленькая</button>
<button type="button" class="btn btn-primary btn-xs">Еще меньше</button>

Хорошо что есть в бутстрапе возможность размеры этими классами указывать.

.btn-lg
.btn-md
.btn-sm
.btn-xs


#5 patriot

patriot

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

  • Пользователи
  • PipPip
  • 23 сообщений

Отправлено 02 Декабрь 2016 - 02:46

По поводу кнопок, кто-то использует блочные кнопки или нет? Просто знаю о такой возможности но пока что никогда не юзал. Интересно кто пользовался и как применял. Показалось интересно и решил спросить.

<button type="button" class="btn btn-primary btn-lg btn-block">Блочная кнопка</button>
<button type="button" class="btn btn-default btn-lg btn-block">Блочная кнопка</button>





Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных