CSS 경계 내 끝 스타일 속성

정의와 사용법

와 속성을 설정하여 요소가 행 내 방향의 끝에 있는 경계 스타일을 정의합니다.

CSS의 와 속성은 border-bottom-style주의:border-left-style주의:border-right-style 、 border-top-style 속성은 매우 유사하지만 와 속성은 행 내 방향에 의존합니다.

注意：相关的 CSS 属性 예제 2: writing-mode 속성과 결합주의:관련 속성 、 예제 3: direction 속성과 결합 와 관련된 CSS 속성 와 내부 방향을 정의합니다. 이는 한 행의 시작과 끝 위치, 그리고

예제

direction
  div {
direction: rtl;

를 설정합니다: 예제 2: writing-mode 속성과 결합 내부 방향의 시작과 끝 변경선의 위치는

direction
  내부 방향의 끝 변경선의 위치는
  div {
direction: rtl;

writing-mode: vertical-rl; 예제 3: direction 속성과 결합 내부 방향의 시작과 끝 변경선의 위치는

direction
  속성 영향:
  div {
direction: rtl;

개인적으로 시도해 보세요

border-inline-end-style: none\|hidden\|dotted\|dashed\|solid\|double\|groove\|ridge\|inset\|outset\|initial\|inherit;	속성 값
none	값
설명	기본 값. 변경선을 지정하지 않습니다.
hidden	none과 동일하지만 테이블 요소의 변경선 충돌 해결에서 다릅니다.
dashed	점선 변경선을 지정합니다.
solid	실선 변경선을 지정합니다.
double	이중선 변경선을 지정합니다.
groove	3D 구릉변경선을 지정합니다. 효과는 border-color의 값에 따라 다릅니다.
ridge	3D 부상변경선을 지정합니다. 효과는 border-color의 값에 따라 다릅니다.
inset	3D 내초변경선을 지정합니다. 효과는 border-color의 값에 따라 다릅니다.
outset	3D 외초변경선을 지정합니다. 효과는 border-color의 값에 따라 다릅니다.
initial	이 속성을 기본 값으로 설정합니다. 참조: initial。
inherit	부모 요소에서 이 속성을 상속합니다. 참조: inherit。

기본 값：	none
상속성：	아니요
애니메이션 제작：	지원하지 않습니다. 참조:애니메이션 관련 속성。
버전：	CSS3
JavaScript 문법：	object.style.borderInlineEndStyle="dotted"

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

크롬	에지	파이어폭스	사파리	오페라
69.0	79.0	41.0	12.1	56.0