CSS 간단 경계선 속성

CSS Border - 줄임 표현

처음에 본 것처럼, 가장자리를 처리할 때는 많은 속성을 고려해야 합니다.

코드를 줄이기 위해 모든 단일 가장자리 속성을 하나의 속성 내에서 지정할 수도 있습니다.

border 이 속성은 다음과 같은 각 가장자리 속성의 단축 속성입니다:

  • border-width
  • border-style（必需）
  • border-color

예제

p {
  border: 5px solid red;
}

결과:

일부 텍스트

직접 테스트해 보세요

하나의 가장자리만을 지정하여 모든 단일 가장자리 속성을 지정할 수도 있습니다:

왼쪽 경계선

p {
  border-left: 6px solid red;
  background-color: lightgrey;
}

결과:

일부 텍스트

직접 테스트해 보세요

하단 경계선

p {
  border-bottom: 6px solid red;
  background-color: lightgrey;
}

결과:

일부 텍스트

직접 테스트해 보세요