w3.css

Margin

w3-margin 클래스는 요소의 모든 면에 16px 마진을 추가한다.
상하 패딩 12px, 좌우 패딩 24px가 있다.

W3.CSS Margin Classes

W3.CSS는 다음 margin 클래스를 제공한다.

여백

w3-margin 클래스는 요소의 모든 측면에 16px 여백을 추가한다.

예제

<div class="w3-container w3-margin">
  <p>I have 16px margin on all sides.</p>
</div>

상단 여백

w3-margin-top 클래스는 요소에 16px 상단 여백을 추가한다.

예제

<div class="w3-container w3-margin-top">
  <p>I have 16px margin on the top.</p>
</div>

하단 여백

w3-margin-bottom 클래스는 요소에 16px 하단 여백을 추가한다.

예제

<div class="w3-container w3-margin-bottom">
  <p>I have 16px margin on the bottom.</p>
</div>

왼쪽 여백

w3-margin-left 클래스는 요소에 16px 왼쪽 여백을 추가한다.

예제

<div class="w3-container w3-margin-left">
  <p>I have 16px margin the left.</p>
</div>

오른쪽 여백

w3-margin-right 클래스는 요소에 16px 오른쪽 여백을 추가한다.

예제

<div class="w3-container w3-margin-right">
  <p>I have 16px margin the right.</p>
</div>

섹션

많은 HTML 요소에는 기본 상단 또는 하단 여백이 없다. 이러한 요소는 사이에 여백 없이 표시된다.

w3-section 클래스를 사용하여 요소를 구분할 수 있다.

HTML 요소에 위쪽 및 아래쪽 여백을 16px 추가한다.

예제

<div class="w3-container w3-section w3-blue">
  <h1>I am Blue</h1>
</div>

<div class="w3-container w3-section w3-green">
  <h1>I am Green</h1>
</div>

Mingg`s Diary

밍구

공부 목적 블로그

https://maz.kr

모든 포스트 보기