W3.CSS 패딩


w3-padding-large

12px 상단 및 하단 패딩과 24px 왼쪽 및 오른쪽 패딩이 있습니다.


W3.CSS 패딩 번호 클래스

w3-padding- number 클래스 는 모든 HTML 요소에 상단 및 하단 패딩을 추가합니다.

등급 정의
w3 패딩-16 요소에 16px 상단 및 하단 패딩을 추가합니다.
w3-패딩-24 요소에 24px 상단 및 하단 패딩을 추가합니다.
w3-패딩-32 요소에 32px 상단 및 하단 패딩을 추가합니다.
w3 패딩-48 요소에 48px 상단 및 하단 패딩을 추가합니다.
w3 패딩-64 요소에 64px 상단 및 하단 패딩을 추가합니다.

예:

w3 패딩-16

16px 상단 및 하단 패딩이 있습니다.

w3-패딩-24

24px 상단 및 하단 패딩이 있습니다.

w3-패딩-32

32px 상단 및 하단 패딩이 있습니다.

w3 패딩-48

48px 상단 및 하단 패딩이 있습니다.

w3 패딩-64

64px 상단 및 하단 패딩이 있습니다.

예시

<div class="w3-panel w3-padding-16">
  <p>I have 16px top and bottom padding.</p>
</div>


W3.CSS 패딩 크기 클래스

w3-padding- size 클래스 는 모든 HTML 요소에 위쪽, 아래쪽, 오른쪽 및 왼쪽 패딩을 추가합니다.

등급 정의
w3 패딩 8px 상단 및 하단, 16px 왼쪽 및 오른쪽 패딩 추가
w3-padding-small 4px 위쪽 및 아래쪽, 8px 왼쪽 및 오른쪽 패딩을 추가합니다.
w3-padding-large 12px 위쪽 및 아래쪽, 24px 왼쪽 및 오른쪽 패딩을 추가합니다.

예:

w3-padding-small

4px 상단 및 하단 패딩과 8px 왼쪽 및 오른쪽 패딩이 있습니다.

w3 패딩

8px 상단 및 하단 패딩과 16px 왼쪽 및 오른쪽 패딩이 있습니다.

w3-padding-large

12px 상단 및 하단 패딩과 24px 왼쪽 및 오른쪽 패딩이 있습니다.

예시

<div class="w3-panel w3-padding-large">
  <p>I have 12px top and bottom padding and 24px left and right padding.</p>
</div>