CSS 경계 블록 너비 속성

정의와 사용법

border-block-width 속성 설정 요소가 블록 방향의 경계선 너비를 정의합니다。

주의:속성을 설정하려면 border-block-width 속성이 적용되려면 설정해야 합니다 border-block-style.

border-block-width 속성의 값을 다양한 방식으로 설정할 수 있습니다：

만약 border-block-width 속성은 두 가지 값을 가집니다：

border-block-width: 10px 50px;

만약 border-block-width 속성은 하나의 값을 가집니다:

border-block-width: 10px;

CSS border-block-width 속성은 CSS 속성 border-bottom-width와border-left-width와border-right-width 그리고 border-top-width 매우 유사하지만 border-block-width 속성은 블록 방향에 따라 달라집니다.

주의:관련 CSS 속성 writing-mode 블록 방향을 정의합니다. 이는 블록의 시작과 끝 위치, 그리고 border-block-width 속성 결과. 영어 페이지에서는 줄 내부 방향은 왼쪽에서 오른쪽으로, 블록 방향은 아래로입니다.

블록 방향의 경계선의 너비를 설정하십시오:

#example1 {
  border-block-style: solid;
  border-block-width: 10px;
}
#example2 {
  border-block-style: solid;
  border-block-width: thin thick;
}

블록 방향의 시작과 끝 위치의 경계선은 writing-mode 속성 영향:

div {
  border-block-style: solid;
  writing-mode: vertical-rl;
  border-block-width: 5px;
}

border-block-width: medium|thin|thick|길이|initial|inherit;

기본값:	중간
상속성:	아니요
애니메이션 제작:	지원됩니다. 참조:애니메이션 관련 속성.
버전:	CSS3
JavaScript 문법:	object.style.borderBlockWidth="3px 10px"

표格에 표시된 숫자는 이 속성을 최초로 완전히 지원하는 브라우저 버전을 나타냅니다.

크롬	에지	파이어폭스	사파리	오페라
87.0	87.0	66.0	14.1	73.0