- Створи репозиторій
goit-markup-hw-03. - Склонуй створений репозиторій і скопіюй в нього файли попередньої роботи.
- Додай стилі для геометрії (ширини, відступи, поля і рамки) і позиціонування контенту за допомогою Flexbox для сторінок макета домашнього завдання #3.
- Налаштуй
GitHub Pagesі додай посилання на живу сторінку в шапку GitHub-репозиторія.
«A1» У корені проекту є папка images з зображеннями.
«A2» У корені проекту є папка css з файлами стилів.
«A3» Всі стилі написані в одному файлі styles.css, який знаходиться в
папці css.
«A4» У назвах файлів відсутні великі літери, пробіли і трансліт, тільки
літери і слова англійської мови.
«A5» Вихідний код відформатований за допомогою Prettier.
«A6» Всі зображення та текстовий контент взяті з макета.
«A7» На всіх HTML-сторінках підключений нормалізатор стилів
modern-nomalize.
«A8» Код написаний з дотриманням настанови.
«B1» Допускається глобальне скидання стилів за селектором тегу для
елементів <h1>...<h6>, <p> і <ul>.
«B2» В елементів відсутні зовнішні відступи (властивість margin),
«пробивають» батьківський елемент.
«B3» В однорядкових колекціях елементів очищений крайній лівий або правий
margin елементів (якщо він є).
«B4» Для відступів між двома сусідніми елементами використовується
властивість margin.
«B5» Для проміжку між межею батька і його дитиною використовується
властивість padding.
«B6» Розміри зовнішніх відступів (властивість margin) і внутрішніх полів
(властивість padding) елементів задані точно за макетом.
«B7» Створений загальний допоміжний клас .container для центрування і
обмеження контенту по ширині.
«B8» Ширина «контейнера» відповідає макету і дорівнює 1158px.
«B9» «Контейнер» обгортає контент хедера, футера і секцій. Тобто
знаходиться всередині них.
«B10» Для розташування елементів використовується Flexbox, але тільки
там, де це необхідно. Наприклад у шапці, навігації, списках в секціях тощо,
тобто там, де розташувати елементи горизонтально по-іншому неможливо.
«B11» Фінальні розміри блоків в браузері відповідають макету.
«B12» В елементів відсутня фіксована висота, вона визначається їх
контентом.
«B13» У хедера є нижня рамка, необхідно сильно наблизити макет, щоб
побачити її.
«B14» Секції розташовані одна під одною як стопка книг, без зовнішніх
відступів.
«B15» Для всіх секцій використовується один клас .section, в якому
задані відповідні падінги, що відсувають контент всередину секції.
«B16» Для побудови сіток використовується техніка, що описана у конспекті
і відео-майстерні.
«B17» У картках на сторінці Портфоліо є рамка (властивість border),
але тільки у нижній частині картки.
