Skip to content
/ goit-markup-hw-07 Public template
generated from OlenaIa/goit-markup-hw-06

Homework of the HTML and CSS block | Website WEBSTUDIO | Adaptive layout.

Notifications You must be signed in to change notification settings

OlenaIa/goit-markup-hw-07

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

15 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

goit-markup-hw-07

Створи репозиторій goit-markup-hw-07. Склонуй створений репозиторій і скопіюй в нього файли попередньої роботи. Виконай верстку адаптивної версії всіх елементів головної сторінки домашнього завдання #7. Налаштуй GitHub Pages і додай посилання на живу сторінку в шапку GitHub-репозиторія.

Критерії приймання роботи наставником

Для здачі домашнього завдання достатньо зробити адаптивну верстку головної сторінки (index.html). Виконання адаптивної верстки сторінки портфорліо (portfolio.html) не обов'язкове для здачі домашнього завдання.

Проект

«A1» При перегляді сторінки на будь-якому пристрої шириною від 320px, не з'являється горизонтальна смуга прокручування.

«A2» Скрипт мобільного меню підключений в HTML окремим файлом mobile-menu.js.

СКРИПТ МОБІЛЬНОГО МЕНЮ

Повний приклад створення мобільного меню з уже написаним скриптом розбери у майстерні.

Розмітка

«B1» У всіх сторінок в блоці є метатег viewport.

«B2» Всі фонові і контентні растрові зображення - респонсивні і підтримують екрани щільністю x1 і x2.

«B3» Для респонсивних фонових зображень використані медіа-функціі min-device-pixel-ratio і min-resolution.

«B4» Виконана розмітка мобільного меню.

Оформлення

«C1» При написанні стилів використаний Mobile First підхід і медіа-функція (min-width: ).

«C2» Стилі, необхідні тільки у певному проміжку, закриті в медіа-запити (min-width: ) and (max-width: ) або тільки (max-width: ).

«C3» В медіа-запитах відсутнє зайве дублювання стилів.

«C4» Верстка виконана щодо трьох точок перелому: 428px, 768px і 1158px.<\p>

«C5» Виконано оформлення мобільного меню.

About

Homework of the HTML and CSS block | Website WEBSTUDIO | Adaptive layout.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published