Курс компонентов Bootstrap уровня II — DVD

Название - «Курс начальной подготовки – необходимые компоненты – уровень II»

Продолжительность – 9 часов 33 минуты

Уровень :средний

Что вы узнаете?

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

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

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

Для кого предназначен этот курс?

• Курс рекомендуется для люди, которые уже познакомились с основами Bootstrap из нашего курса «Основы Bootstrap уровень I».
• Знание HTML и CSS приветствуется.

Научитесь создавать таблицы, кнопки, сообщения

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

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

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

Узнайте, как создавать формы

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

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

Позаботьтесь об элементах навигации

Другой тип компонента, который вы научитесь создавать в этом уроке, — это элементы навигации. К ним относятся конструкция гармошки и элементы развала. Однако какой была бы хорошая навигация без внедрения меню на веб-сайте? Таким образом, вы научитесь добавлять в свое меню выпадающие элементы и эффекты таблеток. Вы также создадите мобильное меню, то есть популярный гамбургер, и научитесь работать с верхней строкой меню, которая будет следовать за движением прокрутки.

1. Введение

1.1. Введение

2. Таблицы

2.1. Форматирование таблиц

2.2. Адаптивность таблиц

2.3. Выравнивание текста по вертикали

3. Тумблеры/кнопки

3.1. Создание переключателя

3.2. Переключение на основе элемента «флажок»

3.3. Переключение на основе элемента «радио»

3.4. Переключатель управления

4. Сообщения

4.1. Идея сообщений обратной связи

4.2. Кнопка закрытия окна

4.3. Управление окном сообщений

4.4. Динамическое добавление структуры сообщений

5. Выпадающий список

5.1. Основы создания раскрывающегося списка

5.2. Позиция в списке

5.3. Содержимое списка

5.4. Назначение тега «a» и тега «button»

5.5. Классы «активный» и «отключенный»

5.6. Управление раскрывающимся списком

6. Формы

6.1. Основы форматирования элементов

6.2. Классы для элемента «флажок»

6.3. Стиль начальной загрузки элемента «флажок»

6.4. Классы для элемента "радио"

6.5. Стиль начальной загрузки элемента «радио»

6.6. Классы для элемента select

6.7. Стиль начальной загрузки элемента select

6.8. Классы и стиль начальной загрузки элемента range

6.9. Классы и стиль файла начальной загрузки

6.10. «Группа ввода», т.е. объединение полей

6.11. Различные комбинации и размеры во «входной группе»

6.12. Элементы «флажок», «переключатель» и «кнопка» во «группе ввода»

6.13. Элемент «выпадающий список» в «группе ввода»

6.14. элемент «выбрать» во «группе ввода»

6.15. Элемент «файл» во «группе ввода»

6.16. Использование системы сеток

6.17. Расположение и выравнивание полей формы

6.18. Проверка – метод 1

6.19. Проверка – метод 2

6.20. Проверка – метод 3

6.21. Валидация – завершение проекта

7. Список групп и закладки

7.1. Изменение ориентации списка

7.2. Списки с кнопками и метками

7.3. Создание закладок

7.4. Управление макетом вкладок

8. Свертывание элемента

8.1. Свернуть элемент – основная информация

8.2. Элемент гармошки

8.3. Управление элементом свертывания

9. Элементы навигации

9.1. Элементы навигации – основы

9.2. Изменение внешнего вида пунктов меню

9.3. Адаптивность и гибкость

9.4. Использование раскрывающегося элемента

9.5. Связывание вкладок и кнопок с контентом

10. Панель навигации

10.1. Структура панели навигации

10.2. Панель навигации без списка

10.3. Цвета панели навигации

10.4. Цвет активной позиции

10.5. Контейнер в панели навигации

10.6. Форма в панели навигации

10.7. Положение панели навигации

10.8. Использование таблеток в панели навигации

10.9. Управление панелью навигации

11. Компонент Scrollspy

11.1. Отслеживание положения прокрутки в контейнере

11.2. Отслеживание положения прокрутки всей страницы

12. Прощание

12.1. Несколько заключительных слов

Как выбрать версию курса:

Видеокурс доступен в двух формах:

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

2. коробка на DVD — вместо ссылки для скачивания вы получите DVD по указанному адресу. В этом случае ищите аукцион с пометкой DVD.

Подойдет ли курс к моей программе?

Курсы созданы с использованием разных версий программы. Однако в большинстве случаев им подходит любая версия. Курсы созданы таким образом, чтобы быть совместимыми и нейтральными для старых версий программного обеспечения. То есть если у вас, например, Photoshop 2019 года и курс создан на версии Photoshop 2020 года, то он подойдет на 100%.

Получу ли я программу вместе с курсом?

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