Розділ 2 · Завдання 5

Рамки (border)

Лінія навколо елемента: товщина, стиль, колір — трьома значеннями одразу.

Завдання

Додайте в style.css:

style.css

.box {
  border: 2px solid #0066cc;
}

І в styles-demo.html

Додайте:

styles-demo.html

<p class="box">Цей текст обведений рамкою</p>

Як це читати

border: 2px solid #0066cc; — товщина, стиль лінії, колір через пробіл.

Стилі лінії

dashed — пунктирна, dotted — крапками, double — подвійна. Спробуйте: border: 3px dashed #ff6600;

Скруглені кути

Додайте ще одну властивість: border-radius: 12px; — чим більше число, тим сильніше скруглення.

Курс створено за підтримки бухгалтерського бюро Galakton, Білосток, Польща