CSS 밴더 아래 왼쪽 라운드 코너 속성

정의와 사용법

border-bottom-left-radius 속성은 왼쪽 아래 테두리 모서리의 형태를 정의합니다.

추천:이 속성은 요소에 둥근 테두리를 추가할 수 있습니다.

추가 자료:

CSS3 강의:CSS3 경계선

예제

div 요소의 왼쪽 아래 모서리에 둥근 테두리를 추가합니다:

div
{
border:2px solid;
border-bottom-left-radius:2em;
}

직접 시험해 보세요

CSS 문법

border-bottom-left-radius: length|% [length|%];

주의사항:border-bottom-left-radius 속성의 길이 값과 백분율 값은 사분면 타원(외부 테두리 모서리의 형태를 정의)의 반지름(radii)을 정의합니다. 첫 번째 값은 수평 반지름이며 두 번째 값은 수직 반지름입니다. 두 번째 값이 누락되면 첫 번째 값이 복사됩니다. 길이가 0이면 모서리는 정方形이 아니라 둥글게 됩니다. 수평 반지름의 백분율은 테두리 상자의 너비를 참조하며, 수직 반지름의 백분율은 테두리 상자의 높이를 참조합니다.

속성 값

값 설명 테스트
length 왼쪽 아래角의 형태를 정의합니다. 테스트
% 왼쪽 아래角의 형태를 백분율로 정의합니다. 테스트

기술 세부 사항

기본 값: 0
상속성: no
버전: CSS3
JavaScript 문법: object.style.borderBottomLeftRadius="5px"

브라우저 지원

표의 숫자는 이 속성을 완전히 지원하는 첫 번째 브라우저 버전을 나타냅니다.

가 -webkit- 또는 -moz-를 포함한 숫자는 프리كس의 첫 번째 버전을 사용하는 것을 의미합니다.

Chrome IE / Edge Firefox Safari Opera
5.0
4.0 -webkit-		 9.0 4.0
3.0 -moz-		 5.0
3.1 -webkit-		 10.5