English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
border-bottom-style CSS 속성은 단일 요소의 아래 모서리 스타일을 설정하는 데 사용됩니다. 하지만, 우리 실제 작업에서는 일반적으로border-style또는border-bottom끝 모서리 스타일을 정의합니다.
다음 표는 이 속성의 사용 설명과 버전 기록, 그리고 JavaScript 스크립트에서 이 속성의 사용 문법을 나타냅니다.
| 기본 값: | 설명 |
|---|---|
| 적용 대상: | 모든 요소 |
| thừa kế: | 없음 |
| 애니메이션 가능: | 아니요.참조하십시오 애니메이션 속성。 |
| 버전： | CSS 1，2，3 |
| JavaScript 문법： | object object.style.borderBottomStyle="dashed" |
이 속성의 문법은 다음과 같습니다：
border-bottom-style: none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset | initial | inherit
아래 예제는 border 사용법을 보여줍니다.-bottom-style 속성.
p {
border-bottom-style: dashed;
border-bottom-width: 3width:
px;}/테스트 결과‹属性值
| 아래 표는 이 속성의 값을 설명합니다。 | 값 |
|---|---|
설명 | none |
| 경계선이 없이 표시합니다. | hidden와 같지만, 테이블 셀은折叠的边框 |
| 또한 두 셀이 경계선을 공유합니다. hidden 값은 경계선을 그리지 않도록 보장하며, 다른 모든 경계선 스타일보다 우선합니다. | dotted |
| 경계선을 일어선 실선으로 표시합니다. | dashed |
| 경계선을 일어선 실선으로 표시합니다. | solid |
| 경계선을 두 개의 평행한 선으로 표시하고, 그들 사이에 간격을 두습니다. 두 줄의 총 길이와 그들 사이의 간격은 | doubleborder-width의 값을 나타냅니다。 |
| groove | 표시하여 그림면에 새겨진 경계선을 표시합니다. 그것은3D의 인상, 일반적으로 경계선 색상보다border-color더 밝고 더 어두운 두 가지 색상으로 그림자를 만들어줍니다. |
| ridge | 효과와 반대의 경계선 groove를 표시합니다. 또한, 그것은3D의 인상, 경계선이 그림면에서 나오는 것처럼 보입니다. |
| inset | 표시하여 요소의 프레임이 그림면에 부착된 것처럼 보입니다. 그것은3D, 이는 일반적으로 경계선 색상보다border-color약간 밝고 깊은 두 가지 색상으로 그림자를 만들어줍니다. |
| outset | 효과와 반대의 경계선 inset을 표시합니다. 또한, 그것은3D의 인상, 경계선이 그림면에서 나오는 것처럼 보입니다. |
| initial | 이 속성을 기본 값으로 설정합니다. |
| inherit | 지정된 경우, 관련 요소는 부모 요소의 border를 사용합니다.-bottom-style 속성의 계산 값。 |
border-bottom-style 속성의 브라우저 호환성, 아래 표의 숫자는 이 속성을 지원하는 브라우저의 최소 버전 번호를 나타냅니다. 모든 주요 브라우저는 이 속성을 지원합니다.
|
교육 자료 참조:CSS Border，CSS3 Border。
관련 속성:border，border-style，border-bottom，border-bottom-color，
border-bottom-width。