(CSS 코딩일기) padding,


Padding, Margin, Border에 대해 알아봅시다.

1.패딩

범위에 공백을 삽입할 때 사용합니다.


숫자의 순서는 0시 -> 3시 -> 6시 -> 9시 순으로 시계방향입니다.

이러한 속성은 각 패딩에 값을 할당하려는 경우에 사용됩니다.

상, 우, 하, 좌 값을 각각 속성으로 나눈다고 생각하시면 됩니다.

아래 두 코드는 완전히 동일합니다.

패딩: 16px 8px 24px 10px;

패딩 상단: 16px;
오른쪽 패딩: 8px;
패딩 바닥: 24px;
패딩 왼쪽: 10px;

두 번째 가장자리

영역 외부에 테두리를 설정하는 데 사용됩니다.

특히 왼쪽과 오른쪽 바깥쪽 가장자리에 자동차 로 자동 채울 수 있었습니다.

요소라는 점에 유의해야 합니다.

넓은 속성이 설정된 경우에만 자동 채울 수 있습니다.


패딩과 마찬가지로 각각에 값을 할당할 때 사용되는 속성입니다.

아래 두 코드는 완전히 동일합니다.

테두리: 16px 8px 24px 10px;

여백 상단: 16px;
오른쪽 여백: 8px;
여백 하단: 24px;
여백 왼쪽: 10px;

세 번째 경계

경계는 경계라는 속성입니다.

테두리: 1px 고정 #dedede;
테두리 반경: 8px;

위의 코드를 입력하면 솔리드(모양) 두께가 1이고 원형이 8픽셀인 상자가 표시됩니다.