본문 바로가기
> HTML-CSS

[CSS] padding 기본 사용법

by bky373 2020. 10. 29.

padding 기본 사용법

- 폼은 margin과 비슷하다 (참고: bky373.tistory.com/184)
- *padding은 추가된 값만큼 요소의 크기가 커진다
    - 이때 box-sizing: border-box; 를 사용하면 요소 크기는 커지지 않는다!


1번- padding: 10px;
2번- padding: 10px 20px;
3번- padding: 10px 20px 30px;
4번- padding: 10px 20px 30px 40px;

1번 적용- padding: [위, 아래, 좌, 우];
2번 적용- padding: [위, 아래], [좌, 우];
3번 적용- padding: 위, [좌, 우], 아래;
4번 적용- padding: 위 우 아래 좌;

1번- padding: 10px;
2번- padding: 10px 20px;
3번- padding: 10px 20px 30px;
4번- padding: 10px 20px 30px 40px;

1번 적용- padding: [위, 아래, 좌, 우];
2번 적용- padding: [위, 아래], [좌, 우];
3번 적용- padding: 위, [좌, 우], 아래;
4번 적용- padding: 위 우 아래 좌;

댓글