CSS границы

Вы можете использовать границы (рамки), применяя их к большинству элементов HTML в пределах страницы. Все, что вам требуется, чтобы сделать границу вокруг элемента — это border-style. Возможные значения, которые можно применять: solid (тонкая граница), dotted (граница состоит из точек, пунктир), dashed (граница состоит из коротких отрезков), double (двойная), groove (эффект углубления), ridge (эффект кромки), inset (эффект врезки) и outset (эффект возвышения).

border-width используется для указания ширины границы, которая измеряется в пикселах. В числе других свойств: border-top-width, border-right-width, border-bottom-width и border-left-width.

И, наконец, border-color используют для указания цвета границы.

Добавьте этот код в CSS-файл:

1

h2

 

2

    border-style: dashed;

 

3

    border-width: 3px;

 

4

    border-left-width: 10px;

 

5

    border-right-width: 10px;

 

6

    border-color: red;

 

7

В результате вы должны получить красную прерывистую границу вокруг заголовка HTML второго уровня (элемент h2) шириной 3 пикселя наверху и внизу, а также 10 пикселей слева и справа (Ширина всей границы в 3 пикселя в результате была определена).