html-css-responsive.md

      

Адаптивний Web Design

1. Responsive web design basics

2. FLEXBOX. Вчимося верстати на флексах

3. Flexbox Froggy - гра для закріплення

4. CSS Grid Layout

5. Grid Garden - гра для закріплення

Після завершення виконайте наступне:

1. Зробіть скріншот своїх завершених уроків і помістіть його в теку task_responsive_web_design вашого репо kottans-frontend
2. В вашому kottans-frontend репо README.md:
   • додайте заголовок ## Responsive Web Design
   • додати скріншот або додати посилання на скріншот
   • перерахуйте свої міркування щодо кожного пункту завдання (що для вас було новим, що вас здивувало, що ви плануєте використовувати в майбутньому)
3. Чудова робота! Діліться своїми досягненнями з іншими – опублікувати повідомлення в course channel: Responsive Web Design — #done (або Responsive Web Design — #p2p_done якщо ви студент курсу p2p) і додайте посилання до свого репо. Цей крок важливий, оскільки він допомагає менторам відстежувати ваш прогрес!
4. Вивчіть додаткові матеріали нижче, щоб покращити свої навички. Якщо ви вважаєте, що це вплине на вашу загальну ефективність курсу, подумайте над тим, щоб повернутись до них пізніше, наприклад коли ви виконаєте всі обов’язкові завдання.
5. Ви можете пропустити опціональні з цього завдання (якщо такі є).

Коли ви закінчите це завдання, ви можете приступити до наступного.

Додаткові матеріали

• Specificity
• Specificity calculator
• 11 things I learned reading the flexbox spec
• Flexbox Zombies (game)
• HiDPI Screens and Web Development

Готово?

➡️ Ідіть далі HTML & CSS Practice

⤴️ Повернутися до Contents