스타일 paddingBottom 속성
예시
<div> 요소의 아래쪽 패딩을 설정합니다.
document.getElementById("myDiv").style.paddingBottom = "50px";
정의 및 사용
paddingBottom 속성은 요소의 아래쪽 패딩을 설정하거나 반환합니다.
margin 속성과 padding 속성은 모두 요소 주위에 공백을 삽입합니다. 그러나 차이점은 여백은 테두리 주위에 공백을 삽입하는 반면 패딩은 요소 테두리 안에 공백을 삽입한다는 것입니다.
브라우저 지원
Property | |||||
---|---|---|---|---|---|
paddingBottom | Yes | Yes | Yes | Yes | Yes |
통사론
paddingBottom 속성을 반환합니다.
object.style.paddingBottom
paddingBottom 속성을 설정합니다.
object.style.paddingBottom = "%|length|initial|inherit"
속성 값
Value | Description |
---|---|
% | Defines the bottom padding in % of the width of the parent element |
length | Defines the bottom padding in length units |
initial | Sets this property to its default value. Read about initial |
inherit | Inherits this property from its parent element. Read about inherit |
기술적 세부 사항
기본값: | 0 |
---|---|
반환 값: | 요소의 아래쪽 패딩을 나타내는 String |
CSS 버전 | CSS1 |
더 많은 예
예시
<div> 요소의 아래쪽 패딩을 다시 "일반"으로 변경합니다.
document.getElementById("myDiv").style.paddingBottom = "0px";
예시
<div> 요소의 아래쪽 패딩을 반환합니다.
alert(document.getElementById("myDiv").style.paddingBottom);
예시
marginBottom과 paddingBottom의 차이점:
function changeMargin() {
document.getElementById("myDiv").style.marginBottom = "100px";
}
function changePadding() {
document.getElementById("myDiv2").style.paddingBottom = "100px";
}
관련 페이지
CSS 튜토리얼: CSS 패딩
CSS 참조: padding-bottom 속성
HTML DOM 참조: 패딩 속성
❮ 스타일 개체