English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
border-bottom-left-radius는 CSS에서 요소의 왼쪽 아래 모서리의 둥근 모양을 설정하는 데 사용됩니다. 이 원형은 원형이나 타원형일 수 있으며, 값이 0일 때는 일반적인 직각 모서리가 됩니다. 배경이 이미지이든 색상이든, 이 속성에 의해 모양이 영향을 받습니다.
다음 표는 이 속성의 사용 설명과 버전 기록, 그리고 JavaScript 스크립트에서 이 속성의 사용 문법을 나타냅니다.
| 기본 값: | 0 |
|---|---|
| 적용 대상: | 모든 요소 |
| thừa kế: | 없음 |
| 애니메이션 가능성: | 는.참조하십시오 애니메이션 속성。 |
| 버전： | CSS3의 새 기능 |
| JavaScript 문법: | objectobject.style.borderBottomRightRadius="3px" |
주의:border-bottom-left-radius는 경계선이 정의되지 않거나 값이 none로 설정되었을 때에도, 요소의 배경을 둥글게 만듭니다.
이 속성의 문법은 다음과 같습니다:
border-bottom-left-radius: [ length | percentage ] 1 또는 2 values | initial | inherit
이 약자는 하나나 두 개의 공백으로 구분된 값을 사용할 수 있습니다.
선택 사항인 두 번째 길이 값은 왼쪽 아래 모서리의 수직 반지름을 정의하며, 따라서 모서리의 모양은 사분면 타원입니다.
두 번째 길이를 생략하거나 두 번째 길이와 같으면, 각角落자의 모양은 사분면 원입니다. 어떤 길이가 0이면, 모서리는 원형 대신 사각형이 됩니다.
아래 예제는 border를 사용하는 방법을 보여줍니다.-bottom-left-radius 속성.
div {
border: 2px solid #f08080;
border-bottom-left-radius: 20px;
}테스트를 보세요‹/›아래 표는 이 속성의 값을 설명합니다.
| 값 | 설명 |
|---|---|
| length | 길이 값을 단위로 사용할 수 있는 것은 px, pt, cm, em 등이며, 음수 값을 사용할 수 없습니다. |
| percentage | 반지름의 크기는 백분율로 표현됩니다. 두 값이 있을 경우, 첫 번째 값은 요소 상자의 너비에 대한 백분율로 계산됩니다(즉, 수평 반지름), 두 번째 값은 요소 상자의 높이에 대한 백분율로 계산됩니다(즉, 수직 반지름) . 음수 값을 사용할 수 없습니다. |
| initial | 이 속성을 기본 값으로 설정합니다. |
| inherit | 지정된 경우, 관련 요소는 부모 요소의 border를 사용합니다.-bottom-left-radius 속성의 계산 값. |
border-bottom-left-radius 속성의 브라우저 호환성을 보여주는 표에서의 숫자는 이 속성을 지원하는 브라우저의 최소 버전 번호를 나타냅니다. 모든 주요 브라우저는 이 속성을 지원합니다.
|
경고: Internet Explorer 8및 이전 버전에서 border를 지원하지 않습니다.-bottom-left-radius CSS 속성은 IE9및 이후 버전에서 지원됩니다。
教程 참조:CSS Border，CSS3 Border。
관련 속성:border-radius，border-bottom-right-radius，border-top-left-radius，border-top-right-radius。