Добрий день, друзі!
Сьогодні маємо гарні новини для всіх, хто хоче навчитися створювати гнучкі веб-сайти за допомогою сучасних технологій – на ITVDN опубліковано новий курс “CSS Flexbox”. Курс українською мовою!
Flexbox (читається як "флексбокс") покликаний спростити позиціонування елементів на сторінці. Він дозволяє забути про проблеми з незручним ручним налаштуванням розмірів і положення блоків, яке забрало б у вас купу часу, так і не давши бажаного результату. За допомогою технології флексбокс можна задати бажану поведінку всім елементам сторінки, прописавши мінімум коду.
Це особливо зручно при адаптивному та мобільному верстанні, коли розміри вашої інтернет-сторінки не фіксовані та змінюють свій розмір залежно від пристрою, з якого користувач зайшов на сайт.
Іншими словами, це сучасний інструмент верстки, що дозволяє швидко створювати складні гнучкі макети та функції, спрощуючи вирішення завдань, для яких раніше використовували чистий CSS.
Сьогодні флексбокси дуже популярні у використанні та підтримуються майже всіма сучасними браузерами.
Автор курсу – Олексій Кучеренко, Frontend розробник та тренер-консультант CyberBionic Systematics.
Курс складається з 4 уроків загальною тривалістю 2 години 40 хвилин.
Програма курсу:
- Знайомство з Flexbox.
- Верстання трьох секцій.
- Зміна потоку та медіа-запити.
- Адаптивне верстання сайту.
Чого ви навчитеся на даному курсі:
- Виконувати верстання header-a макету та меню в ньому.
- Створювати просте меню на сайті за допомогою флексбокс технології.
- Використовувати властивості flex-grow та flex-shrink для створення «гумового» верстання.
- Виконувати планшетну та мобільну версії простої сторінки без використання додаткових правил медіа-запитів.
- Розуміти функції властивостей align-items, flex-wrap, order, а також їх нюанси та переваги використання.
- Працювати з додатковим потоком у flexbox, розміщуючи елементи у потрібній позиції.
- Розуміти, як, навіщо і коли потрібно змінити напрямок основного потоку.
- Розміщувати багато рядових блоків, незалежно від їхньої кількості, працюючи з флексбоксами.
Попередні вимоги
Матеріал розрахований на тих, хто має базові знання з HTML & CSS.
Дивіться перший урок у вільному доступі. Курс вже доступний на нашому сайті в повному обсязі – до кожного уроку є практичні завдання, опорний конспект та онлайн тести для більш глибокого засвоєння матеріалу. Якщо у вас є активна підписка, ви можете дивитися його прямо зараз.
Курс входить до програм підготовки за напрямками FrontEnd Developer та Верстальник сайтів.
