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;
}