CSS 테두리 속성

정의와 사용법

border 단축 속성은 하나의 선언에서 모든 경계 속성을 설정합니다.

다음과 같은 순서로 속성을 설정할 수 있습니다:

또한, 어떤 값이 설정되지 않아도 문제가 발생하지 않습니다. 예를 들어, border:solid #ff0000; 또한 허용됩니다.

추가 참조:

CSS 강의:CSS 경계선

HTML DOM 참조 가이드:border 속성

예제

4개의 경계 스타일을 설정합니다:

p
  {
  border:5px solid red;
  }

직접 시도해 보세요

CSS 문법

border: border-width border-style border-color|initial|inherit;

속성 값

값 설명
border-width 경계의 너비를 정의합니다. 참조:border-width 가능한 값.
border-style 경계의 스타일을 정의합니다. 참조:border-style 가능한 값.
border-color 경계의 색상을 정의합니다. 참조:border-color 가능한 값.
inherit 부모 요소에서 border 속성 설정을 상속해야 한다고 규정합니다.

기술 세부 사항

기본 값: 미지정
상속성: no
버전: CSS1
JavaScript 문법: object.style.border="3px solid blue"

추가 예제

모든 경계 속성은 하나의 선언에 포함됩니다
이 예제에서는 각 4개의 경계 속성을 하나의 선언에서 설정하는 단축 속성을 보여줍니다.

브라우저 지원

표에서의 숫자는 해당 속성을 완전히 지원하는 첫 번째 브라우저 버전을 표시합니다.

크롬 IE / 엣지 파이어폭스 사파리 오페라
1.0 4.0 1.0 1.0 3.5