Практична робота

1. Перейдіть до сервісу CodePen та зареєструйтесь/авторизуйтесь на ньому:  http://bit.ly/3yUUful

2. Виберіть пункт меню Pen, введіть назву html-проєкту BoxModel#2

3. Розмістіть вікна для зручної роботи (Change View) та максимально зменшіть вікно JS

4. Створіть веб-сторінку за зразком (див. зразок), скористайтесь css-довідником (css-directory): https://css.in.ua/ та презентацією з теоретичним матеріалом: http://bit.ly/3TxsbXq

5. HTML-файл: див. зразок нижче

6. CSS-файл: див. зразок нижче

7. Додайте CSS-властивості:

- надати відповідну висоту, границю, відступи блокам:

* header (висота 50px; зовнішній відступ знизу – 5 пікселів)

* footer (висота 50px; зовнішній відступ зверху – 5 пікселів)

* one (висота 200px; зовнішній відступ знизу – 5 пікселів, відступи між внутрішніми блоками - 5 пікселів)

* two (висота 350px; зовнішній відступ знизу – 5 пікселів, відступи між внутрішніми блоками - 5 пікселів)

* three (відступи між внутрішніми блоками - 5 пікселів)

- встановити тип шрифту Arial, розмір шрифту 25px, жирний шрифт, усі великі букви, колір тексту білий

- вирівняти текст по центру блока в кожному блоці

- змінити текст блоку two__2 на власне прізвище

8. Збрежіть (Save) та та скопіюйте посилання для поширення (Share - Copy link)

9. Надішліть посилання на html-проєкт BoxModel#2 через платформу Human