Обери свою IT спеціальність
Почати безкоштовноFlexbox - це сучасний інструмент верстки, що дозволяє швидко створювати складні гнучкі макети та функції, спрощуючи вирішення завдань, для яких раніше ми використовували чистий CSS.
Даний курс дозволить вам практично розглянути прийоми використання технології Flexbox. Ви познайомитеся із загальними поняттями та принципами логіки роботи технології, навчитеся застосовувати основні властивості, розгляньте способи взаємодії між елементами, побачите те, як можна комбінувати медіа запити з флексбоксом та багато іншого.
Базові знання верстки HTML & CSS. Бажано ознайомлення з технологією верстки FlexBox
Технологія flexbox дозволяє створювати більш легко та правильніше розкладку елементів для вебсторінки на відміну від float-ів, Flexbox дозволяють з легкістю вирівнювати елементи по горизонталі та по вертикалі, змінювати напрямок та порядок відображення елементів, розтягувати блоки на всю висоту чи ширину, або прибивати їх до будь-якого краю батьківського елемента.
Мета уроку - ознайомитися з основами технології flexbox, загальними поняттями та принципами логіки роботи технології flexbox, виробити розуміння того, як використовувати flexbox на практиці. Познайомитись із початковою простою структурою перед створенням лендіг (односторінкового) сайту та розібратися з тим, як виконувати перші кроки при верстці. Також розглянути створення простого меню на сайті з використанням флексбокс технології.
Мета уроку - ознайомитися з основними властивостями, що використовуються на практиці, і отримати розуміння того, коли їх використовувати. Розібрати які є можливості у властивостей align-items, flex-wrap, order, а також їх нюанси та переваги використання.
Мета уроку - розібрати як, навіщо і коли потрібно змінити напрямок основного потоку. Переглянути які аспекти з'являються при зміні потоку. Розглянути, якою стає поведінка у властивості margin з flexbox елементами, яким чином можна використовувати медіа запити при верстці макета, використовуючи flexbox технологію. Ознайомитися з властивістю flexdirection і як змінює свою поведінку властивість margin з використанням флексбоксів.
Мета уроку - познайомитися з властивостями flex-grow і flex-shrink для створення гумової верстки. Ознайомитись із процесом завершення планшетної та мобільної версії простої сторінки без використання додаткових правил медіа запитів.
Надіслати код ще раз
Змінити номер телефону
Надіслати код ще раз
Змінити email