Поиск по сайту:
Я не люблю сражаться, я люблю побеждать (Б. Шоу).

Учебное пособие по framework Bootstrap

1 Звезда2 Звезды3 Звезды4 Звезды5 Звезд (15 оценок, среднее: 4,40 из 5)
Загрузка...
13.05.2017
Учебное пособие по framework Bootstrap

Twitter Bootstrap один из самых популярных front-end вэб-фреймворков. Это удобный, интуитивно понятный и мощный мобильный первый фреймворк для более быстрой и простой веб-разработки. Он использует HTML, CSS и Javascript. Эти статьи научат вас основам Bootstrap Framework с помощью которого можно создавать любые веб-проекты. Статьи разделены на разделы, которые состоят из основной структуры Bootstrap, Bootstrap CSS, Компоненты слоев Bootstrap и плагины Bootstrap. Каждый из этих разделов содержит темы, связанные с простыми и полезными примерами.

Аудитория

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

Предпосылки

Перед тем, как приступить к изучению Twitter Bootstrap, мы предполагаем, что вы уже знаете об основах HTML и CSS. Если вы не очень хорошо осведомлены об этих понятиях, то вам рекомендуется изучить основы HTML и CSS.

Пример кода на Bootstrap

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

<!DOCTYPE html>
<html lang = "en">
   
   <head>
      <meta charset = "utf-8">
      <meta http-equiv = "X-UA-Compatible" content = "IE = edge">
      <meta name = "viewport" content = "width = device-width, initial-scale = 1">
      
      <title>Шаблон Bootstrap 101</title>
      
      <!-- Bootstrap -->
      <link href = "//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" rel = "stylesheet">
      
      <!-- В HTML5 shim и Respond.js для поддержки IE8 элементы HTML5 и медиа запросов -->
      <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
      
      <!--[if lt IE 9]>
      <script src = "https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src = "https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
      <![endif]-->
      
   </head>
   
   <body>
      <h1>Привет мир!</h1>
      
      <!-- jQuery (необходимые JavaScript плагины для Bootstrap's) -->
      <script src = "https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
      
      <!-- Включает все скомпилированные плагины (ниже), или включает отдельные файлы по мере необходимости -->
      <script src = "//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
      
   </body>
</html>

 

Если вы нашли ошибку, пожалуйста, выделите фрагмент текста и нажмите Ctrl+Enter.

Если статья понравилась, то поделитесь ей в социальных сетях:

Читайте также

0 0 голоса
Рейтинг статьи
Подписаться
Уведомить о
guest

**ссылки nofollow

2 комментариев
Старые
Новые Популярные
Межтекстовые Отзывы
Посмотреть все комментарии
Виталий Бриль

Какой-то бред… У меня не работает и всё запутанно рассказано.
Интересней было бы привести пример в стиле ООП

Сергей Брин

Нормально всё расписано.
В моей компании многие используют эту статью.

Спасибо!

Теперь редакторы в курсе.