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

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

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

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

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

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