CSS의 어떤 속성이 요소의 올바른 패딩을 지정합니까?-CSS 튜토리얼-php.cn

CSS의 어떤 속성이 요소의 올바른 패딩을 지정합니까?

PHPz

풀어 주다： 2023-09-12 19:13:10

앞으로

595명이 탐색했습니다.

CSS 中哪个属性指定元素的右填充？

CSS에서 패딩 속성을 사용하면 HTML 요소의 테두리와 콘텐츠 사이에 추가 공간을 추가할 수 있습니다. 오른쪽 패딩은 요소 콘텐츠와 오른쪽 테두리 사이에 공백만 추가하는 것을 의미합니다.

여기에서는 요소의 올바른 패딩을 지정하는 두 가지 속성을 알아봅니다.

패딩 오른쪽 CSS 속성 사용

'padding-right' 속성은 CSS에서 요소의 올바른 패딩을 지정합니다. 요소에 오른쪽 패딩을 지정할 때마다 요소의 너비는 실제 너비 + 오른쪽 패딩과 같습니다.

문법

사용자는 아래 구문에 따라 요소의 올바른 패딩을 지정할 수 있습니다.

으아악

예 1

아래 예에서 상위 div에는 여러 하위 div가 포함되어 있습니다. "padding-right" CSS 속성을 사용하여 상위 div에 대해 "300px"의 오른쪽 패딩을 지정합니다. 또한 모든 하위 div 요소에 대해 100px의 패딩 오른쪽을 지정합니다.

출력에서 사용자는 오른쪽 테두리와 하위 div 사이에 300px 공간이 있음을 확인할 수 있습니다. 또한 오른쪽 테두리와 텍스트 내용 사이에는 100px의 여유 공간이 있습니다.

으아악

예 2

아래 예에서는 카드 구성 요소를 만들고 여기에 이미지를 추가했습니다. 또한 카드 div에 10px의 오른쪽 패딩을 지정했습니다. 출력에서 사용자는 오른쪽에 10px 공간을 관찰할 수 있습니다.

으아악

CSS 채우기 속성 사용

padding 속성은 요소의 네 면 모두에 패딩을 설정합니다. 오른쪽 패딩을 값으로 설정하고 다른 쪽을 0으로 설정할 수 있습니다. 첫 번째 값은 위쪽을 나타내고, 두 번째 값은 오른쪽을 나타내고, 세 번째 값은 아래쪽, 네 번째 값은 왼쪽을 나타냅니다. 따라서 두 번째 값을 제외하고 값으로 0을 유지하겠습니다.