CSS에서 개별 측면 테두리

개별 측면을 위한 단축 속성도 있습니다: border-left (왼쪽 테두리), border-right (오른쪽 테두리), border-top (상단 테두리), border-bottom (하단 테두리).

border-left 속성을 사용하여 요소에 왼쪽 테두리만 만들어 봅시다:

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

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

Результат:

이제 동시에 왼쪽과 오른쪽 테두리를 만들어 봅시다:

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

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

Результат: