# | Название видеоурока | Видео / Тесты | Решило | Рейтинг | Доступ |
---|---|---|---|---|---|
1 |
![]() |
2 теста |
|||
На этом уроке мы рассмотрим, что такое bootstrap-4, рассмотрим инструменты и материалы для нашего проекта Отчёт отправил: 20302. Дмитрий Выполнено за 2 дня 4 час. 14 мин. [Показать отчёт] Научился: Значит bootstrap - это про CSS? Brackets пока не ставлю - попробую в phpstorm или Visual Studio. Ну или в Notepad++ |
|||||
2 | Основа и фреймворк |
4 теста |
|||
На этом уроке мы создадим проект лендинг-страницы и подключим к нему библиотеку bootstrap-4 Отчёт отправил: 20302. Дмитрий Выполнено за 2 дня 14 час. 24 мин. [Показать отчёт] Научился: Интерактивный режим это приятно) Ну в этом уроке все просто. |
|||||
3 | Верная навигация |
3 теста |
|||
На этом уроке мы создадим красивое адаптивное навигационное меню для нашего сайта Отчёт отправил: 20302. Дмитрий Выполнено за 2 дня 19 час. 14 мин. [Показать отчёт] Научился: Круто! Вот только где взять все эти navbar-...? |
|||||
4 | Заголовок header - красивая основа |
2 теста |
|||
На этом уроке мы создадим заголовок header и зададим его стиль
Отчёт отправил: 20302. Дмитрий Выполнено за 2 дня 7 час. 0 мин. [Показать отчёт] Научился: У меня с картинкой получилось только через OptnServer. Просто так не находится она. И background-size закомментил, т.к. слишком сильно растягивалась. Непонятно почему. |
|||||
5 | Заголовок header - оверлей, надпись и кнопка |
2 теста |
|||
На этом уроке мы дооформим header, и разместим на нем надпись и кнопку
Отчёт отправил: 20302. Дмитрий Выполнено за 22 час. 28 мин. [Показать отчёт] Научился: Ctrl+F5 - обновить стили. Полезная штука. |
|||||
6 | Об авторе - блоки и HTML |
2 теста |
|||
На этом уроке мы создадим блок "Об авторе" и наполним его контентом
Отчёт отправил: 20302. Дмитрий Выполнено за 1 день 4 час. 40 мин. [Показать отчёт] Научился: Фотку поменьше сделал |
|||||
7 | Об авторе - отступы и дополнения |
1 тест |
|||
На этом уроке мы сделаем дополнения информации об авторе и начнем работу со стилями в данном блоке Отчёт отправил: 20302. Дмитрий Выполнено за 19 час. 3 мин. [Показать отчёт] Научился: С цветами, конечно, доработать надо, чтобы в гамме было с хэдером) Сложности: Возникли трудности с размером картинки - при сжатии экрана она слишком большая. Пришлось изменять исходный размер. |
|||||
8 | Об авторе - отступы, цвета, закругления |
1 тест |
|||
На этом уроке мы зададим красивые цвета тексту и интересный вид картинки
Отчёт отправил: 20302. Дмитрий Выполнено за 1 день 1 час. 40 мин. [Показать отчёт] Научился: Как-то подпись рядом с картинкой не особо смотрится. Хотя, дело вкуса |
|||||
9 | Товар лицом |
|
|||
На этом уроке мы создадим заготовки для портфолио (представления товара или услуг)
Отчёт отправил: 20302. Дмитрий Выполнено за 18 час. 11 мин. [Показать отчёт] Научился: Так что же - каждую картинку вручную вставлять? А если у меня тысячи изображений? Чувствую, эта страница должна генерироваться сервером |
|||||
10 | Отзывы - размещение карточек |
|
|||
На этом занятии мы создадим и заполним карточки отзывов
Отчёт отправил: 20302. Дмитрий Выполнено за 1 день 1 час. 52 мин. [Показать отчёт] Научился: Ну вот только не очень красиво с такой рамкой. И подравнять надо. Надеюсь, на следующем уроке это будет. Сложности: Не понял, что делать если картинка большого разрешения. Как сделать, чтобы она адекватно отображалась для всех экранов? |
|||||
11 | Отзывы - стили |
1 тест |
|||
На этом уроке мы зададим стиль карточкам отзывов Отчёт отправил: 20302. Дмитрий Выполнено за 1 день 1 час. 49 мин. [Показать отчёт] Научился: Карточки с одинаковой высотой и шириной лучше бы смотрелись. |
|||||
12 | Отзывы: карты - в сетку |
4 теста |
|||
На этом уроке мы сделаем карты ровными и научимся использовать в стилях шрифты с google fonts
Отчёт отправил: 20302. Дмитрий Выполнено за 1 час. 12 мин. [Показать отчёт] Научился: Сейчас fonts.google.com изменился, но @import найти можно. Кстати по умолчанию в bootstrap тоже вполне хороший шрифт. Как сделать, чтобы картинки не сжимались как на скрине? |
|||||
13 | Обратная связь - создание формы |
1 тест |
|||
На этом уроке мы создадим форму обратной связи
Отчёт отправил: 20302. Дмитрий Выполнено за 4 час. 31 мин. [Показать отчёт] Научился: Вроде несложно. Но на 1ом скрине размер не айс) |
|||||
14 | Обратная связь - стильная форма |
1 тест |
|||
На этом уроке мы зададим стили элементам формы обратной связи
Отчёт отправил: 20302. Дмитрий Выполнено за 9 мин. [Показать отчёт] Научился: Наверно надо бы еще сменить цвет хэдера |
|||||
15 | JS-навигация |
|
|||
На этом уроке мы сделаем пункты меню активными и реализуем навигацию по сайту при помощи jQuery
Отчёт отправил: 20302. Дмитрий Выполнено за 3 дня 5 час. 1 мин. [Показать отчёт] Научился: В итоге выкладываю отчет - исправлено id портфолио, все работает, кроме анимации. |
|||||
16 | ФИНАЛЬНЫЙ УРОК |
без видео |
|||
Сделай видео-презентацию своей программы. На видео необходимо ответить на следующие вопросы: 0. Показать, что у тебя получилось. 1. Чему ты научился на этом курсе? 2. Что тебе понравилось, что нет? 3. Что ты ещё добавишь в свой проект? 4. Какой следующий курс ты будешь проходить? |
|||||
Итого: 16 видеоуроков |
2 час. 59 мин. 24 теста |
5 чел. | |||
Финалисты: Konstantin, vip, Yaroslav, Николай Денисов, Tom . |