Як зробити блоки в css

Створіть перший блок. У вигляді HTML коду він буде виглядати, як тег div з id `block01`. Тут ідентифікатор block01 вказує на те, що в CSS описі все властивості даного блоку вказані для селектора # block01.

Опишіть блок в CSS. У стилях CSS вкажіть назву ідентифікатора (# block01) і в фігурних дужках опишіть його параметри - ширину, позиціонування, зміщення, колір фону і т.д. Наприклад, це може виглядати так: # block01 {width: 150px; height: 150px; position: absolute- top: 0px; left: 0px; background-color: pink}. Даний опис має на увазі, що блок буде мати в довжину і ширину 150 пікселів, він буде жорстко розміщений у верхньому лівому кутку документа, а його задній фон буде пофарбований в рожевий колір.

Задайте блоку відносне позиціонування. Якщо в описі CSS використовувати не абсолютне, а відносне позиціонування, то ви зможете розміщувати блоки не з жорсткою прив`язкою до сітки координат, а щодо інших, вже існуючих блоків. Для цього поміняйте код position: absolute- top: 0px; left: 0px на position: relative- top: 200px; left: 100px.

Задайте блоку скругление. В CSS за це відповідає інструкція border-radius. Допишите в таблиці стилів наступний код: border-radius: 8px. Тепер блок матиме закруглені кути. Якщо ви хочете скруглить тільки деякі кути, опишіть радіус окремо для кожного з них: border-radius: 8px 8px 0px 0px.

Задайте блоку обведення. Щоб виділити контури блоку тонкою лінією, додайте в його CSS опис наступний код: border-top: 1px dashed black. Ця інструкція означає, що межа блоку буде чорного кольору і буде мати один піксель в товщину. При цьому сама лінія контуру буде відображатися пунктиром (dashed - пунктиром, dotted - точками, solid - суцільною лінією).

Задайте залишилися властивості блоку. Вкажіть в CSS описі, яку гарнітуру потрібно використовувати для тексту всередині блоку, яким повинен бути розмір шрифту, його вирівнювання та відступ від країв блоку. Ці властивості описуються в термінах font-family, font-size, text-align і padding.

Щоб налаштувати обтікання одного блоку іншими, можна використовувати властивість float. Якщо виставити його значенням "left", то інші елементи будуть обтікати блок зліва, а "right" - справа. Якщо виставити значення float, як "none" - вирівнювання блоку не буде задано. Властивість clear в CSS забороняє обтікання блоку з правої, лівої або обох сторін і скасовує інструкцію float.