최신 웹 개발 튜토리얼
 

Style padding Property

<스타일 개체

예

a의 패딩 설정 <div> 요소를 :

document.getElementById("myDiv").style.padding = "50px 10px 20px 30px";
»그것을 자신을 시도

정의 및 사용

패딩 속성 집합 또는 요소의 패딩을 반환합니다.

이 속성은 하나에서 네 개의 값을 취할 수 있습니다

마진 속성과 요소 주위의 패딩 속성 삽입 공간 모두. 그러나 차이는 패딩은 요소의 테두리 내에서 공간을 삽입하면서 마진이 국경 주변의 공간을 삽입하는 것입니다.

  • 하나 개의 값은 같은 : DIV {패딩 : 50 픽셀} - 네면은 50 픽셀의 패딩을해야합니다
  • 사업부 : 같은 두 값, {패딩 : 50 픽셀 10px} - 10px 상단과 하단 패딩은 왼쪽, 50 픽셀 것 오른쪽 패딩이 될 것입니다
  • 사업부 : 같은 세 가지 값, {패딩 : 50 픽셀 10px 20 픽셀} - 상단 여백이 50 픽셀, 왼쪽 및 오른쪽 여백이 10px 될 것입니다 될 것입니다, 바닥 패딩이 될 것입니다 20 픽셀
  • 사업부 : 같은 네 개의 값, {패딩 : 50 픽셀 10px 20 픽셀 30 픽셀} - 상단 여백이 50 픽셀 것, 바로 패딩 10px 것, 바닥 패딩이 20 픽셀 될 것입니다, 왼쪽 패딩이 될 것입니다 30 픽셀

브라우저 지원

Internet ExplorerFirefoxOperaGoogle ChromeSafari

패딩 속성은 모든 주요 브라우저에서 지원됩니다.

통사론

패딩 속성을 반환합니다 :

object .style.padding

패딩 속성을 설정합니다 :

object .style.padding=" 속성 값
값 기술
% 부모 요소의 폭 %에 패딩을 정의
length 길이 단위로 패딩을 정의
initial 기본값으로이 속성을 설정합니다. 초기 읽기에 대한
inherit 부모 요소에서이 속성을 상속합니다. 대한 상속 읽기

기술적 세부 사항

기본값: 0
반환 값 : 요소의 패딩을 나타내는 문자열
CSS 버전 CSS1

더 예

예

(A)의 네면의 패딩 변경 <div> 에 요소를 "25px" :

document.getElementById("myDiv").style.padding = "25px";
»그것을 자신을 시도

예

a의 패딩 돌아 가기 <div> 요소를 :

alert(document.getElementById("myDiv").style.padding);
»그것을 자신을 시도

예

마진 속성과 패딩 속성의 차이 :

function changeMargin() {
    document.getElementById("myDiv").style.margin = "100px";
}

function changePadding() {
    document.getElementById("myDiv2").style.padding = "100px";
}
»그것을 자신을 시도

관련 페이지

CSS 자습서 : CSS 패딩

CSS 참조 : padding property

<스타일 개체