Свойство-сокращение за граница в CSS

Точно както при шрифтовете, за границите също съществува свойство-сокращение border, което можем да използваме вместо да пишем 3 различни свойства за дебелина, цвят и тип на границата. В това свойство можем просто да изброим стойностите за границата в произволен ред.

Нека да разгледаме пример. Да предположим, че имаме такава граница:

#elem {
	border-width: 1px;
	border-style: solid;
	border-color: black;
	width: 300px;
	height: 100px;
}

Нека я пренапишем чрез свойството-сокращение:

#elem {
	border: 1px solid red;
	width: 300px;
	height: 100px;
}

Повторете страницата по дадения образец: