CSS Padding
CSS Padding 속성은 요소의 테두리와 내용 사이의 공간을 정의합니다.
Padding
요소의 Padding(패딩)이 지워지면 "해제된" 영역이 해당 요소의 배경색으로 채워집니다.
채우기 속성만 사용하여 위쪽, 아래쪽, 왼쪽, 오른쪽 패딩을 변경할 수 있습니다. 약어 채우기 속성을 사용할 수도 있습니다. 일단 변경되면 모든 것이 변경됩니다.
이 단축 속성은 요소의 모든 패딩 너비를 설정하거나 각 측면의 패딩 너비를 설정합니다. 인라인, 대체되지 않은 요소에 설정된 패딩은 줄 높이 계산에 영향을 주지 않습니다. 따라서 요소에 패딩과 배경이 모두 있는 경우
다른 콘텐츠가 겹칠 가능성이 있어 시각적으로 다른 줄로 확장될 수 있습니다. 요소의 배경은 패딩을 가로질러 확장됩니다. 음수 여백 값은 허용되지 않습니다.
padding-top:20px; 상단 패딩
padding-right:30px; 오른쪽 패딩
하단 패딩
padding-left:20px; 왼쪽 패딩
padding: 4면 모두 1px 통합 패딩
padding: 1px 상하, 왼쪽 및 오른쪽 패딩
패딩: 1px1px1px 상단, 왼쪽 및 오른쪽, 하단 패딩
패딩: 1px1px1px1px 상단, 오른쪽, 하단, 왼쪽 패딩
참고: 음수 값은 허용되지 않습니다.
가능한 값
auto: 브라우저가 여백을 계산합니다.
length: 픽셀, 센티미터 등과 같은 특정 단위로 여백 값을 지정합니다. 기본값은 0px입니다.
%: 여백을 상위 요소 너비의 백분율로 지정합니다.
inherit: 여백이 상위 요소에서 상속되도록 지정합니다.
padding: 약어 속성을 사용하여 하나의 선언에 모든 패딩 속성을 설정
padding-bottom: 요소의 하단 패딩 설정
padding-left: 왼쪽 부분 설정 요소의 Padding
padding-right: 요소의 오른쪽 패딩 설정
padding-top: 요소의 위쪽 패딩 설정