[CSS] 패딩(padding)

1. 패딩(padding)

  - 내용(content)과 테두리(border) 사이의 간격이다. 

  - 패딩은 눈에 보이지 않는다.

  

2. 패딩의 속성

  - 패딩의 속성은 top, right, bottom, left 순으로 설정한다.

 

2-1 1개의 padding 속성값을 가질 때

ex) padding: 5px;

=> padding-top: 5px

     padding-right: 5px

     padding-bottom: 5px

     padding-left: 5px

 

2-2 2개의 padding 속성값을 가질 때

ex) padding: 10px 20px;

=> padding-top: 10px

     padding-right: 20px

     padding-bottom: 10px

     padding-left: 20px

 

2-3 3개의 padding 속성값을 가질 때

ex) padding: 10px 20px 30px;

=> padding-top: 10px

     padding-right: 20px

     padding-bottom: 30px

     padding-left: 20px

 

2-4 4개의 padding 속성값을 가질 때

ex) padding: 10px 20px 30px 40px;

=> padding-top: 10px

     padding-right: 20px

     padding-bottom: 30px

     padding-left: 40px