[CSS] margin, padding

# 마진(margin) 요소와 요소 사이의 간격

     .b1 {
      /* 1. 각각 설정 */
      margin-top:  30px;
      margin-bottom: 30px;
      margin-left: 30px;
      margin-right: 30px;
     }
     .b2 {
      /* 2. 한꺼번에 설정: 상 → 우 → 하 → 좌 시계방향으로 설정 */
      margin: 50px 30px 30px 80px;
     }
     .b3 {
      /* 3. 한꺼번에 설정: 상/하, 좌/우 값이 같을 때 */
      margin: 40px 20px;
     }
     .b4 {
      /* 4. 한꺼번에 설정: 상/우/하 값이 있을때, 왼쪽은 오른쪽과 같은 값을 사용 */
      margin: 50px 40px 30px;
     }
     .b5 {
      /* 5. 한꺼번에 설정: 1개의 값, 상/우/하/좌의 값 모두 같을 때 */
      margin: 30px;
     }

# 패딩(padding) 요소 내부에서 테두리와 내용 사이의 간격

      .b1 {
        /* 1. 각각 설정 */
        padding-top: 30px;
        padding-bottom: 30px;
        padding-left: 30px;
        padding-right: 30px;
      }
      .b2 {
        /* 2. 한꺼번에 설정: 상 → 우 → 하 → 좌 시계방향으로 설정 */
        padding: 50px 30px 20px 40px;
      }
      .b3 {
        /* 3. 한꺼번에 설정: 상/하, 좌/우 값이 같을 때 */
        padding: 50px 30px;
      }
      .b4 {
        /* 4. 한꺼번에 설정: 상/우/하 값이 있을때, 왼쪽은 오른쪽과 같은 값을 사용 */
        padding: 50px 30px 20px;
      }
      .b5 {
        /* 5. 한꺼번에 설정: 1개의 값, 상/우/하/좌의 값 모두 같을 때 */
        padding: 30px;
      }