• Skip to main content
  • Skip to secondary menu
  • Skip to primary sidebar
  • Skip to footer

Мастерская интернета

курсы по Wordpress, Bootstrap, Dreamweaver

  • YouTube
  • Twitter
  • Facebook
  • Главная
  • WordPress
  • Уроки WordPress
    • Строим сайт на WordPress в JustWrite
    • Создаем сайт-визитку
  • Bootstrap
    • Создаем сайт в Bootstrap 3
  • Блог
  • Контакты
  • Войти

Урок 7: создаем меню в Bootstrap 3

Bootstrap 3 предлагает несколько видов меню.   Для ознакомления со всеми вариантами оформления меню, зайдите на сайт Bootstrap-3, где дается документация Bootstrap 3 на русском языке.  Кликните на компоненты, а затем выберите «навигационная панель» справа.

lesson7-0

Я покажу вам принцип построения меню на одном примере, а вы сможете его в дальнейшем модифицировать на свое усмотрение.

Для начала создадим несколько дополнительных страниц к нашему сайту. Дважды копируем страницу index.html и переименовываем в contact.html и about.html.

lesson701picture

Вводим следующий код на странице index.html и на всех новых страницах:

урок7-1фото

И получаем меню:

урок7фото

Если поменять в navbar-default на navbar-inverse, меню примет следующий вид:

урок7фото3

урок7-5

Смотреть продолжение — Урок 8

 

Filed Under: Bootstrap, Создаем сайт в Bootstrap 3 Tagged With: Bootstrap 3

Reader Interactions

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

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

Этот сайт использует Akismet для борьбы со спамом. Узнайте как обрабатываются ваши данные комментариев.

Primary Sidebar

Рубрики

  • Создаем сайт в Bootstrap 3
  • Создаем сайт-визитку
  • Сайт на бесплатной теме WordPress
  • WordPress: полезные советы

ЗАХОДИТЕ НА НАШ КАНАЛ!

Свежие записи

  • Создаем интернет-магазин бесплатно (пошаговая инструкция) — Урок 1
  • Урок 9 — добавляем карту расположения офиса
  • Урок 8 — Строим сайт-визитку для небольшого бизнеса (создаем календарь записи на прием)
  • Урок 7 — Строим сайт-визитку для небольшого бизнеса (редактируем главную страницу.Часть 2)
  • Урок 6 — Строим сайт-визитку для небольшого бизнеса (редактируем главную страницу.Часть 1)

Footer

  • Facebook
  • Twitter
  • YouTube

© 2025 · DengiVNete · Все содержание, включая идеи оформления и стиль, являются объектом авторского права. Свободное некоммерческое использование материалов в интернете, полное или частичное, допускается при условии активной ссылки на www.dengivnete.com и указания авторства.