Поиск по сайту:

Учебник по Bootstrap

Bootstrap - Модальный плагин Bootstrap – плагин для модальных окон -

Модальное окно это дочернее окно, которое наслаивается над его родительское окно. Как правило, цель состоит в том, чтобы отобразить содержимое из отдельного источника, который может иметь некоторое взаимодействие, не выходя из родительского окна. Дочерние окна могут предоставить информацию, взаимодействие, или что-то другое. Если вы хотите включить эту функциональность плагина в отдельности, то вам нужен modal.js. В противном случае, как уже упоминалось в главе Обзор плагинов Bootstrap, вы можете включить bootstrap.js или минимизированный bootstrap.min.js. Применение Вы можетеЧитать далее… >

Bootstrap - плагин переходов Bootstrap – плагин переходов -

Плагин переходов предоставляет простые эффекты перехода. Если вы хотите включить эту функциональность плагина в отдельности, то вам нужно подключить файл transition.js один раз вместе с другими файлами JS. В противном случае, как уже упоминалось в главе Bootstrap – Обзор плагинов, вы можете включить bootstrap.js или минимизированный bootstrap.min.js. Transition.js является основным помощником для событий transitionEnd, а также эмулятор переходов CSS. Он используется другими плагинами для проверки поддержки перехода CSS и поймать висячие переходы. Случаи использования Несколько примеровЧитать далее… >

Bootstrap - Wells Bootstrap – Wells -

well это контейнер <div>, позволяет содержанию появляться выделенным в ячейку на страницу. Чтобы создать well, просто оберните содержание, которое вы хотели бы, чтобы оно оказалось обернутым в ячейку <div>, в класс .well . Следующий пример показывает, well по умолчанию: <div class = “well”>Привет, я well !!</div>   Определение размеров Вы можете изменить размер используя дополнительные классы, такие как, well-lg или well-sm. Эти классы используются в сочетании с классом .well. Они влияют на отступы, что делает больше илиЧитать далее… >

Bootstrap – Панели -

В этой главе мы поговорим о панелях в Bootstrap. Компоненты панели используются, когда вы хотите, установить компонент DOM в окне. Для того, чтобы получить основную панель, просто добавьте класс .panel к элементу <div>. Кроме того, добавить класс .panel-default для этого элемента, как показано в следующем примере: <div class = “panel panel-default”> <div class = “panel-body”> Это основная панель </div> </div>   Панель с заголовком Есть два способа добавить панель заголовка: Используйте класс .panel-heading чтобы легко добавить контейнер заголовка панели.Читать далее… >

Bootstrap - Список групп Bootstrap – Список групп -

Цель списка групп компонентов для визуализации сложного и настроенного содержимого в списках. Чтобы получить список основной группы, необходимо: Добавьте класс .list-group в элемент <ul>. Добавить класс .list-group-item в элемент <li>. Следующий пример демонстрирует это: <ul class = “list-group”> <li class = “list-group-item”>Бесплатная регистрация доменных имен</li> <li class = “list-group-item”>Бесплатные оконное пространство хостинга</li> <li class = “list-group-item”>Количество изображений</li> <li class = “list-group-item”>Поддержка 24*7</li> <li class = “list-group-item”>Стоимость продления в год</li> </ul>   Добавление значков в список группы МыЧитать далее… >

Bootstrap - Обзор плагинов Bootstrap – Обзор плагинов -

Рассмотренная в предыдущих главах оформления компонентов являются только началом. Bootstrap поставляется в комплекте с 12 плагинами JQuery, которые расширяют возможности и могут добавить больше взаимодействия на вашем сайте. Для того, чтобы начать работу с плагинами JavaScript в Bootstrap, не обязательно быть опытным разработчиком на JavaScript. Используя Bootstrap Data API, большинство плагинов могут быть вызвано не написав ни одной строчки кода. Плагины Bootstrap могут быть включены на сайте в двух формах: Индивидуально – Использование индивидуальных BootstrapЧитать далее… >

Bootstrap - Медиа объект Bootstrap – Медиа объект -

В этой главе рассказывается об медиа-объекте. Эти абстрактные типы объектов предназначены для построения различных типов компонентов (например, комментарии в блоге, твиты и т.д.), которые показываются по левому краю или по правому краю изображения наряду с текстовым содержанием. Цель медиа-объектов, сделать код для разработки блоков информации значительно короче. Цель медиа-объектов (световая разметка, легкая расширяемость) достигаются путем применения классов для некоторых из простых разметок. Есть две формы для медиа-объектов: .media – Этот класс позволяет вставлять медиа-объект (изображения,Читать далее… >

Bootstrap - Прогрессирующая шкала Bootstrap – Прогрессирующая шкала -

В этой главе обсуждаются о прогрессирующей шкале в Bootstrap. Цель прогрессирующей шкалы, показать активность загрузки, в процессе, или что происходит действие в отношении элементов на странице. В прогрессирующих шкалах используются CSS3 переходы и анимация для достижения некоторых их результатов. Эти функции не поддерживаются в Internet Explorer 9 и ниже или более ранние версии Firefox. Opera 12 не поддерживает анимацию. Прогрессирующая шкала по умолчанию Чтобы создать базовый индикатор: Добавить <div> с классом .progress. Далее, внутри <div>, добавьте пустой <div>Читать далее… >

Bootstrap - Оповещения Bootstrap – Оповещения -

В этой главе мы поговорим о предупреждениях и классах обеспечивающих получение оповещений в Bootstrap. Сигналы обеспечивают способ стиля сообщений пользователя. Они обеспечивают контекстные сообщения обратной связи для типичных действий пользователя. Вы можете добавить дополнительный значок рядом, для предупреждения. Для встроенных предупреждений используйте плагин JQuery Alerts. Вы можете добавить базовое предупреждение, создавая оболочку <div> и добавив класс .alert и один из четырех контекстных классов (например, .alert-success, .alert-info, .alert-warning, .alert-danger), следующий пример демонстрирует это: <div class=”alert alert-success”>Успешно! Все успешно отправлено.</div>Читать далее… >

Сообщить об опечатке

Текст, который будет отправлен нашим редакторам:

Заполните форму и наш менеджер перезвонит Вам в самое ближайшее время!

badge
Обратный звонок 1
Отправить
galka

Спасибо! Ваша заявка принята

close
galka

Спасибо! Ваша заявка принята

close