Основы работы с границами в CSS

Сейчас мы научимся добавлять границу элементам. Это делается при помощи трех свойств: свойство border-width задает толщину границы, border-color - цвет, а border-style задает тип границы.

Первые два свойства работают очевидным образом: border-color принимает цвета в том же формате, что и свойство color, а толщина границы задается в пикселях. А вот свойство border-style принимает значения в виде ключевых слов. Например, значение solid задает сплошную линию.

Сделаем, к примеру, границу толщиной 3 пикселя, в виде сплошной линии, красного цвета

<div id="elem"></div>

#elem {
	border-width: 3px;    /* толщина 3px */
	border-style: solid;  /* в виде линии */
	border-color: red;    /* красный цвет */
	width: 300px;
	height: 100px;
}

Результат выполнения кода: