Bootstrap ru: Bootstrap. Документация на русском языке.

Leave a Comment / Разное / By /

Содержание

Введение. Начало работы · Bootstrap v5.0.2

Быстрый старт

Хотите использовать Бутстрап в своем проекте? Используйте jsDelivr, бесплатную CDN с открытым исходным кодом. Нужна система управления пакетами или исходники Bootstrap? Перейдите на страницу загрузки.

CSS

Скопируйте и вставьте часть кода <link> в свой <head> перед всеми другими таблицами стилей, чтобы загрузить наш CSS.

<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">

JS

Многие из наших компонентов требуют использовать для работы JavaScript. В частности, для них требуются наши собственные плагины JavaScript и Popper. Поместите один из следующих тегов <script> в конце страницы, прямо перед закрывающим тегом </body>, чтобы включить их.

Пакетное подключение

Включите каждый плагин Bootstrap JavaScript в один из двух наших пакетов. Оба файла, и bootstrap.bundle.js и bootstrap.bundle.min.js включают в себя Popper для наших всплывающих подсказок и всплывающих окон. Для получения дополнительной информации о том, что входит в Bootstrap, смотрите раздел содержание.

<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
Раздельное подключение

Если вы решите использовать отдельные скрипты, сначала должен быть подключен Popper (если вы используете всплывающие подсказки или всплывающие окна), а затем наши плагины JavaScript.

<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js" integrity="sha384-IQsoLXl5PILFhosVNubq5LC7Qb9DXgDA9i+tQ8Zj3iwWAwPtgFTxbJ8NT4GN1R8p" crossorigin="anonymous"></script>
<script src="https://cdn. jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-cVKIPhGWiC2Al4u+LWgxfKTRIcfu0JTxR+EQDz/bgldoEyl4H0zUF0QKbrJ0EcQF" crossorigin="anonymous"></script>
Модули

Если вы используете <script type="module">, смотрите раздел Использование Bootstrap в качестве модуля.

Компоненты

Любопытно, какие компоненты явно требуют наши JavaScript и Popper.js? Нажмите ссылку «Показать компоненты» ниже. Если вы не уверены в том, как правильно написать «коренную» структуру страницы, можете использовать наши шаблоны.

Показать компоненты, требующие JavaScript
  • Уведомления отмены
  • Кнопки изменения состояний и чекбоксов/»радио»
  • Карусель для поведения «слайд», элементы контроля и индикаторы
  • Коллапс для изменения видимости содержимого
  • Выпадающие элементы для отображения и расположения (также требует Popper)
  • Модальные окна для отображения, расположения и создания поведения прокрутки
  • Навбар для расширения нашего плагина коллапса для придания отзывчивого поведения
  • Выплывающие подсказки и окна для отображения и расположения (также требует Popper)
  • Отслеживание прокрутки и обновления навигации

Стартовый шаблон

Убедитесь, что ваши страницы сверстаны в соответствии с последними стандартами дизайна и разработки.

Это означает использование HTML5 и включение метатега области просмотра для правильного «отзывчивого» поведения страниц. Вот как должены выглядеть ваши страницы:

<!doctype html>
<html lang="ru">
  <head>
    <!-- Обязательные метатеги -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- Bootstrap CSS -->
    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">

    <title>Привет мир!</title>
  </head>
  <body>
    <h2>Привет мир!</h2>

    <!-- Дополнительный JavaScript; выберите один из двух! -->

    <!-- Вариант 1: Bootstrap в связке с Popper -->
    <script src="https://cdn.
  jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>

    <!-- Вариант 2: Bootstrap JS отдельно от Popper
    <script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js" integrity="sha384-IQsoLXl5PILFhosVNubq5LC7Qb9DXgDA9i+tQ8Zj3iwWAwPtgFTxbJ8NT4GN1R8p" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-cVKIPhGWiC2Al4u+LWgxfKTRIcfu0JTxR+EQDz/bgldoEyl4H0zUF0QKbrJ0EcQF" crossorigin="anonymous"></script>
    -->
  </body>
</html>

Это все, что вам нужно из общих требований к странице. Посетите раздел Система сеток или наши официальные примеры для создания контента и компонентов вашего сайта.

Важные глобальные атрибуты

Бутстрап включает некоторые глобальные стили и настройки, о которых вам необходимо знать при работе с ним; все эти стили и настройки почти полностью имеют дело с и «заточены» под нормализацию кроссбраузерных стилей.

Тип текущего документа

Bootstrap требует использования doctype HTML5. Без него у вас возникнут некоторые проблемы со стилями, но его включение не должно вызывать каких-либо серьезных сбоев.

<!doctype html>
<html lang="ru">
  ...
</html>

Мета-теги для адаптивной вёрстки

Bootstrap разрабатывался как mobile first, т.е. его настройки прежде всего оптимизированы под мобильные устройства, а уж потом с помощью медиа-запросов мы подгоняем масштаб компонентов как нам необходимо на прочих устройствах. Вставьте этот кусок кода в <head>:

<meta name="viewport" content="width=device-width, initial-scale=1">

Вы можете увидеть пример этого в действии в Начальном шаблоне страницы.

Размер ширины и высоты элемента (Box-sizing)

Для большей простоты масштабирования в CSS мы изменяем глобальное значение box-sizing с content-box на border-box. Это гарантирует, что padding не будет влиять на конечную вычисленную ширину элемента; однако может создать проблемы для сторонних приложений, таких как Google Maps или поисковой движок Google.

В том редком случае, когда вам понадобится переопределить его, делайте так:

 .selector-for-some-widget {
  box-sizing: content-box;
}

В приведенном выше фрагменте все вложенные элементы, включая сгенерированный контент с помощью ::before и ::after, будут наследовать указанный размер блока box-sizing для этого .selector-for-some-widget.

Узнайте больше о блоковой модели и параметризации размеров на CSS Tricks.

«Ребут» (новая библиотека CSS, не использующая классов, обеспечивающая «модульный подход»)

Для улучшенной кроссбраузерной визуализации мы используем «Ребут», обеспечивающий более продвинутые «сбросы стилей» для элементов HTML для коррекции мелких багов в браузерах и девайсах.

Оставайтесь в курсе последних новостей Bootstrap и вливайтесь в сообщество Bootstrap с помощью этих ресурсов:

  • Читайте и подписывайтесь на Официальный блог Bootstrap.
  • Присоединиться к официальной комнате Slack.
  • Общайтесь с другими Bootstrappers в IRC. На сервере
    irc.freenode.net    , в канале ##bootstrap.
  • Справку по реализации можно найти на сайте Stack Overflow (с тегом bootstrap-5).
  • Разработчикам следует использовать ключевое слово bootstrap в пакетах, которые изменяют или расширяют функциональность Bootstrap при распространении через npm или аналогичные механизмы доставки для максимальной узнаваемости.

Вы также можете присоединиться к @getbootstrap on Twitter, чтобы следить за последними слухами и потрясающими музыкальными клипами.

Вступление. Начало работы · Bootstrap. Версия v4.6

Cмотреть на GitHub

Начните работу с Bootstrap, самой популярной в мире платформой для создания адаптивных сайтов, ориентированных на мобильные устройства, с jsDelivr и шаблонами страниц.

Быстрый старт

Хотите использовать Бутстрап в своем проекте? Используйте jsDelivr, бесплатную CDN с открытым исходным кодом. Нужна система управления пакетами или исходники Bootstrap? Перейдите на страницу загрузки.

CSS

Скопируйте и вставьте таблицу стилей <link> в Ваш <head> перед всеми остальными таблицами стилей, чтобы загрузить наш CSS.

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-zCbKRCUGaJDkqS1kPbPd7TveP5iyJE0EjAuZQTgFLD2ylzuqKfdKlfG/eSrtxUkn" crossorigin="anonymous">

JS

Многие из наших компонентов требуют использования JavaScript. В частности, для них требуются jQuery, Popper.js и наши собственные плагины. Мы используем тонкую сборку jQuery, но также поддерживается полная версия.

Поместите дин из следующих тегов <script> в конце страниц, прямо перед закрывающим тегом </body>, чтобы включить их. Сначала должен быть jQuery, затем Popper.js, а затем наши плагины JavaScript.

В связке

Включите каждый плагин Bootstrap JavaScript в один из двух наших пакетов. И bootstrap.bundle.js и bootstrap.bundle.min.js включают Popper для наших всплывающих подсказок и всплывающих окон, но не jQuery. Сначала включите jQuery, а затем пакет Bootstrap JavaScript. Дополнительную информацию о том, что включено в Bootstrap, можно найти в разделе содержимое.

<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-fQybjgWLrvvRgtW6bFlB7jaZrFsaBXjsOMm/tB9LTS58ONXgqbR9W8oWht/amnpF" crossorigin="anonymous"></script>
Раздельно

Если Вы решите использовать отдельные скрипты, сначала должен быть Popper (если Вы используете всплывающие подсказки или всплывающие окна), а затем наши плагины JavaScript.

<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-VHvPCCyXqtD5DqJeNxl2dtTyhF78xXNXdkwX1CZeRusQfRKp+tA7hAShOK/B/fQ2" crossorigin="anonymous"></script>
Компоненты

Интересно, какие компоненты явно требуют jQuery, нашего JavaScript и Popper? Щелкните ссылку “Показать компоненты” ниже. Если Вы не уверены в структуре страницы, продолжайте читать, чтобы увидеть пример шаблона страницы.

Показать компоненты, требующие JavaScript
  • Alerts: Уведомления для отклонений
  • Buttons: Кнопки для переключения состояний и функции флажка/радио
  • Carousel: Карусель для любого поведения слайдов, элементов управления и индикаторов
  • Collapse: Сворачиваемый контент для переключения видимости контента
  • Dropdowns: Выпадающие списки для отображения и позиционирования (также требуется Popper. js)
  • Modals: Модальные окна для отображения, позиционирования и прокрутки
  • Navbar: Панель навигации для расширения нашего плагина Сворачивания контента для реализации адаптивного поведения
  • Tooltips и popovers: Всплывающие подсказки и Всплывающие окна для отображения и позиционирования (также требуется Popper.js)
  • Scrollspy: Слежение прокрутки для поведения прокрутки и обновлений навигации

Начальный шаблон страницы

Убедитесь, что Ваши страницы настроены в соответствии с последними стандартами дизайна и разработки. Это означает использование документа HTML5 и включение метатега области просмотра для правильного реагирования. Соберите все это вместе, и Ваши страницы должны выглядеть так:

<!doctype html>
<html lang="ru">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://cdn. jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-zCbKRCUGaJDkqS1kPbPd7TveP5iyJE0EjAuZQTgFLD2ylzuqKfdKlfG/eSrtxUkn" crossorigin="anonymous">

    <title>Привет, мир!</title>
  </head>
  <body>
    <h2>Привет, мир!</h2>

    <!-- Дополнительный JavaScript; выберите один из двух! -->

    <!-- Вариант 1: пакет jQuery и Bootstrap (включает Popper) -->
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-fQybjgWLrvvRgtW6bFlB7jaZrFsaBXjsOMm/tB9LTS58ONXgqbR9W8oWht/amnpF" crossorigin="anonymous"></script>

    <!-- Вариант 2: Отдельные JS для Popper и Bootstrap -->
    <!--
    <script src="https://cdn. jsdelivr.net/npm/[email protected]/dist/jquery.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-VHvPCCyXqtD5DqJeNxl2dtTyhF78xXNXdkwX1CZeRusQfRKp+tA7hAShOK/B/fQ2" crossorigin="anonymous"></script>
    -->
  </body>
</html>

Это все, что вам нужно из общих требований к странице. Посетите Обзорный раздел или наши официальные примеры для создания контента и компонентов вашего сайта.

Важные глобальные атрибуты

Bootstrap использует несколько важных глобальных стилей и настроек, о которых Вам необходимо знать при его использовании, и все они почти исключительно нацелены на нормализацию кроссбраузерных стилей. Давайте погрузимся.

HTML5 doctype

Bootstrap требует использования документа типа HTML5. Без него Вы увидите несколько забавных неполных стилей, но его включение не должно вызывать каких-либо серьезных сбоев.

<!doctype html>
<html lang="ru">
  ...
</html>

«Отзывчивый» мета-тэг

Bootstrap разрабатывался как mobile first, т.е. его настройки прежде всего оптимизированы под мобильные устройства, а уж потом с помощью медиа-запросов мы подгоняем масштаб компонентов как нам необходимо на прочих устройствах. Вставьте этот кусок кода в <head>:

<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

Вы можете увидеть пример этого в действии на странице начального шаблона страницы.

Размер ширины и высоты элемента

Для большей простоты масштабирования в CSS мы изменяем глобальное значение box-sizing с content-box на border-box. Это гарантирует, что padding не будет влиять на конечную вычисленную ширину элемента; однако может создать проблемы для сторонних приложений, таких как Google Maps или поисковой движок Google.

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

.selector-for-some-widget {
  box-sizing: content-box;
}

С использованием фрагмента кода, приведенного выше, вложенные элементы – включая сгенерированный через :before и :after контент – будут все наследовать заданный box-sizing для класса .selector-for-some-widget.

Узнайте больше о блоковой модели и параметризации размеров на CSS Tricks.

«Ребут»

(библиотека CSS, не использующая классов, обеспечивающая «модульный подход»)

Для улучшенной кроссбраузерной визуализации мы применили «Ребут», обеспечивающий более продвинутые «сбросы стилей» для элементов HTML для коррекции мелких багов в браузерах и девайсах.

Оставайтесь в курсе последних новостей Bootstrap и вливайтесь в сообщество Bootstrap с помощью этих ресурсов:

  • The Official Bootstrap Blog.
  • the official Slack room.
  • Чат с камрадами по Bootstrap. Канал ##bootstrap на сервере irc.freenode.net.
  • Помощь в реализации Bootstrap 4 на Stackoverflow bootstrap-4).
  • При разработке через npm или аналогичные депозитарии, разработчикам следует использовать ключевое слово bootstrap в своих пакетах и библиотеках для максимальной видимости.

Вы также можете присоединиться @getbootstrap on Twitter для получения «свежайших» слухов и классных музыкальных клипов.

CSP и встроенные SVG

Некоторые компоненты Bootstrap включают встроенные SVG в наш CSS для единообразного и простого стиля компонентов в разных браузерах и на разных устройствах. Для организаций с более строгими конфигурациями CSP, мы задокументировали все экземпляры наших встроенных SVG (все из которых применяются через background-image), поэтому Вы можете более тщательно изучить свои варианты.

  • Иконка закрытия (используется в предупреждениях и модальных окнах)
  • Обычные формы
  • Выключатели
  • Валидация
  • Меню выбора
  • Carousel с органами управления
  • Навбар — отзывчивое поведение

Основываясь на обсуждениях сообщества, некоторые варианты решения этой проблемы в Вашей собственной кодовой базе включают замену URL-адресов локально размещенными ресурсами, удаление изображений и использование встроенных изображений (невозможно во всех компонентах) и изменение вашего CSP. Наша рекомендация — внимательно изучить свои собственные политики безопасности и при необходимости выбрать лучший путь для дальнейшего развития.

Примеры · Bootstrap v5.2

Фрагменты

Общие шаблоны для создания сайтов и приложений, основанных на существующих компонентах и ​​утилитах с пользовательским CSS и т.д.

Заголовки

Покажите свой брендинг, навигацию, поиск и многое другое с помощью этих компонентов заголовка

героев

Создайте сцену на своей главной странице с героями, которые содержат четкие призывы к действию.

Характеристики

Объясните особенности, преимущества или другие детали вашего маркетингового контента.

Боковые панели

Общие шаблоны навигации, идеально подходящие для макетов вне холста или с несколькими столбцами.

Нижние колонтитулы

Завершите каждую страницу эффектным нижним колонтитулом, большим или маленьким.

Выпадающие списки

Расширьте свои раскрывающиеся списки с помощью фильтров, значков, пользовательских стилей и многого другого.

Список групп

Расширьте группы списков утилитами и пользовательскими стилями для любого контента.

Модалы

Преобразуйте модальные окна для любых целей, от экскурсий по функциям до диалогов.

Пользовательские компоненты

Совершенно новые компоненты и шаблоны, которые помогут людям быстро начать работу с Bootstrap и продемонстрируют передовой опыт добавления в платформу.

Альбом

Простой одностраничный шаблон для фотогалерей, портфолио и многого другого.

Цены

Пример страницы с ценами, созданной с помощью карточек и имеющей настраиваемый верхний и нижний колонтитулы.

Касса

Пользовательская форма оформления заказа, показывающая наши компоненты формы и их функции проверки.

Продукт

Простая маркетинговая страница, ориентированная на продукт, с обширной сеткой и изображениями.

Крышка

Одностраничный шаблон для создания простых и красивых домашних страниц.

Карусель

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

Блог

Журнал как шаблон блога с заголовком, навигацией, избранным контентом.

Приборная панель

Базовая оболочка панели администратора с фиксированной боковой панелью и панелью навигации.

Войти

Пользовательский макет формы и дизайн для простой формы входа.

Липкий нижний колонтитул

Прикрепите нижний колонтитул к нижней части окна просмотра, если содержимое страницы короткое.

Липкая панель навигации нижнего колонтитула

Прикрепите нижний колонтитул к нижней части окна просмотра с фиксированной верхней панелью навигации.

Джамботрон

Используйте утилиты для воссоздания и улучшения jumbotron Bootstrap 4.

Framework

Примеры, посвященные использованию встроенных компонентов, предоставляемых Bootstrap.

Стартовый шаблон

Ничего, кроме основ: скомпилированные CSS и JavaScript.

Сетка

Несколько примеров макетов сетки со всеми четырьмя уровнями, вложением и т. д.

Шпаргалка

Кухонная мойка из компонентов Bootstrap.

Шпаргалка RTL

Кухонная мойка из компонентов Bootstrap, RTL.

Панели навигации

Берем компонент панели навигации по умолчанию и показываем, как его можно перемещать, размещать и расширять.

Навбары

Демонстрация всех адаптивных и контейнерных опций для панели навигации.

Навбары offcanvas

То же, что и в примере с Navbars, но с нашим компонентом offcanvas.

Навбар статический

Одиночный пример статической верхней панели навигации вместе с некоторым дополнительным содержимым.

Навбар фиксированный

Пример одной панели навигации с фиксированной верхней панелью навигации и некоторым дополнительным содержимым.

Панель навигации нижняя

Пример одной панели навигации с нижней панелью навигации и некоторым дополнительным содержимым.

Панель навигации Offcanvas

Превратите свою расширяемую панель навигации в скользящее меню вне холста (не использует наш компонент вне холста).

RTL

См. RTL-версию Bootstrap в действии с этими модифицированными примерами пользовательских компонентов.

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

Пожалуйста, откройте вопрос.

Альбом RTL

Простой одностраничный шаблон для фотогалерей, портфолио и многого другого.

Касса RTL

Пользовательская форма оформления заказа, показывающая наши компоненты формы и их функции проверки.

Карусель RTL

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

Блог RTL

Журнал как шаблон блога с заголовком, навигацией, избранным контентом.

Приборная панель RTL

Базовая оболочка панели администратора с фиксированной боковой панелью и панелью навигации.

Интеграция

Интеграция с внешними библиотеками.

Кирпичная кладка

Объедините возможности сетки Bootstrap и макета Masonry.

Идите дальше с темами Bootstrap

Нужно что-то большее, чем эти примеры? Поднимите Bootstrap на новый уровень с премиальными темами с официального рынка тем Bootstrap. Они созданы как собственные расширенные фреймворки, богатые новыми компонентами и плагинами, документацией и мощными инструментами сборки.

Просмотр тем

Что такое Bootstrap и как он работает?

По

  • Эндрю Золя

Что такое Bootstrap?

Bootstrap — это бесплатная среда разработки интерфейса с открытым исходным кодом для создания веб-сайтов и веб-приложений. Bootstrap, разработанный для обеспечения адаптивной разработки мобильных веб-сайтов, предоставляет набор синтаксиса для шаблонов.

В качестве платформы Bootstrap включает в себя основы для адаптивной веб-разработки, поэтому разработчикам нужно только вставить код в предварительно определенную систему сетки. Платформа Bootstrap построена на языке гипертекстовой разметки (HTML ) , каскадных таблицах стилей (CSS ) и JavaScript. Веб-разработчики, использующие Bootstrap, могут создавать веб-сайты намного быстрее, не тратя время на изучение основных команд и функций.

12-колоночная сетка Bootstrap может оперативно обновляться в зависимости от размера экрана.

Для чего используется Bootstrap?

Bootstrap делает адаптивный веб-дизайн реальностью. Это позволяет веб-странице или приложению определять размер и ориентацию экрана посетителя и автоматически адаптировать отображение соответствующим образом. Подход, ориентированный на мобильные устройства, предполагает, что смартфоны, планшеты и мобильные приложения для конкретных задач являются основными инструментами сотрудников для выполнения работы. Bootstrap отвечает требованиям этих технологий в дизайне и включает в себя компоненты пользовательского интерфейса, макеты, инструменты JavaScript и структуру реализации. Программное обеспечение доступно в предварительно скомпилированном виде или в виде исходного кода.

Марк Отто и Джейкоб Торнтон разработали Bootstrap в Twitter, чтобы улучшить согласованность инструментов, используемых на сайте, и сократить объем обслуживания. Программное обеспечение ранее было известно как Twitter Blueprint и иногда упоминается как Twitter Bootstrap.

Что такое бутстрап на компьютере?

В вычислительной технике термин начальная загрузка означает загрузку или загрузку программы в компьютер с использованием начальной программы гораздо меньшего размера для загрузки желаемой программы, которой обычно является ОС.

Что такое Bootstrap CSS?

Самым популярным CSS-фреймворком для разработки адаптивных и ориентированных на мобильные устройства веб-сайтов является Bootstrap. Самая новая версия — Bootstrap 5.

.

Что такое самозагрузка в статистике?

В статистике начальная загрузка описывает процесс повторной выборки набора данных для создания множества смоделированных выборок. Этот подход позволяет пользователям вычислять стандартные ошибки, выполнять проверку гипотез и строить доверительные интервалы для различных типов выборочной статистики.

Что такое загрузочное распределение?

Процедура повторной выборки, бутстрэппинг, использует данные из выборки для создания выборочного распределения путем повторного взятия случайных выборок из известной выборки.

Что такое начальное машинное обучение?

Для повышения стабильности алгоритмов машинного обучения (ML) выборка Bootstrap используется в ансамблевом алгоритме, называемом агрегированием или пакетированием Bootstrap. При начальной загрузке ML с заменой извлекается определенное количество подмножеств набора данных одинакового размера.

Что такое протокол начальной загрузки?

Bootstrap Protocol (BOOTP) — это интернет-протокол, в котором сетевой пользователь может быть автоматически настроен на получение IP-адреса и загрузку ОС без участия пользователя. Сетевой администратор управляет сервером BOOTP, который автоматически назначает IP-адрес из пула адресов на определенный период времени.

Что такое загрузочная CDN?

Веб-сайты с начальной загрузкой часто нуждаются в увеличении скорости. Сеть доставки контента помогает решить эту проблему и быстрее доставляет статический контент пользователям. Это лучший подход для одновременного повышения вовлеченности пользователей и скорости загрузки страниц.

Что такое самозагрузка в общих чертах?

В физическом мире ремешок — это небольшой ремешок или петля на задней части кожаного ботинка, позволяющая надевать ботинок. В общем случае бутстрэппинг — это преобразование небольших первоначальных усилий во что-то большее и более значимое. Метафора «подтягиваться за ноги» означает добиться успеха с малого.

См. также: разработка мобильных приложений , web app , native app , hybrid app , mobile OS , web development framework and web application development

Последнее обновление: август 2022 г.

Продолжить чтение о Bootstrap
  • Почему система сетки Bootstrap имеет ширину 12 столбцов?
  • Профессиональные облачные услуги увидеть больше инвестиций
  • 9 проверенных сред разработки с открытым исходным кодом
  • Попробуйте это руководство по GitOps с Flux и Kubernetes
  • Тонкие настройки TLS в Kubernetes пробуждают у пользователей аппетит к более простому управлению
СИЭМ

Управление информацией и событиями безопасности (SIEM) — это подход к управлению безопасностью, который объединяет функции управления информацией о безопасности (SIM) и управления событиями безопасности (SEM) в одной системе управления безопасностью.

Сеть

  • сетевой трафик

    Сетевой трафик — это объем данных, которые перемещаются по сети в любой момент времени.

  • динамический и статический

    В общем, динамический означает «энергичный, способный к действию и/или изменению или сильный», тогда как статический означает «постоянный или фиксированный».

  • MAC-адрес (адрес управления доступом к среде)

    MAC-адрес (адрес управления доступом к среде) — это 12-значное шестнадцатеричное число, назначаемое каждому устройству, подключенному к сети.

Безопасность

  • контрольная сумма

    Контрольная сумма — это значение, представляющее количество битов в передаваемом сообщении, которое используется ИТ-специалистами для обнаружения …

  • информация о безопасности и управление событиями (SIEM)

    Управление информацией о безопасности и событиями (SIEM) — это подход к управлению безопасностью, объединяющий информацию о безопасности . ..

  • Злая Корпорация

    Evil Corp — международная сеть киберпреступников, использующая вредоносное ПО для кражи денег с банковских счетов жертв и для …

ИТ-директор

  • зеленые ИТ (зеленые информационные технологии)

    Green IT (зеленые информационные технологии) — это практика создания и использования экологически устойчивых вычислений.

  • ориентир

    Контрольный показатель — это стандарт или точка отсчета, которые люди могут использовать для измерения чего-либо еще.

  • пространственные вычисления

    Пространственные вычисления широко характеризуют процессы и инструменты, используемые для захвата, обработки и взаимодействия с трехмерными данными.

HRSoftware

  • самообслуживание сотрудников (ESS)

    Самообслуживание сотрудников (ESS) — это широко используемая технология управления персоналом, которая позволяет сотрудникам выполнять множество связанных с работой .

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *