W3.CSS 边距
w3-margin 类向元素的所有边添加 16px 边距。
W3.CSS 边距类
W3.CSS 提供了以下边距类:
| 类 | 定义 |
|---|---|
| w3-margin | 向元素的所有边添加 16px 边距 |
| w3-margin-top | 为元素添加 16px 的上边距 |
| w3-margin-right | 为元素添加 16px 的右边距 |
| w3-margin-bottom | 为元素添加 16px 的底部边距 |
| w3-margin-left | 向元素添加 16px 的左边距 |
| w3-section | 为元素添加 16px 的顶部和底部边距 |
边距
w3-margin 类为元素的所有边添加 16px 的边距:
w3-margin 类为元素的所有边添加 16px 边距。
边距顶部
w3-margin-top 类为元素添加 16px 的上边距:
w3-margin-top 类为元素添加 16 像素的 top 边距。
底部边距
w3-margin-bottom 类为元素添加 16px 的底部边距:
w3-margin-bottom 类为元素添加 16px bottom 边距。
实例
<div class="w3-container w3-margin-bottom">
<p>I have 16px margin on the bottom.</p>
</div>
亲自试一试 »
左边距
w3-margin-left 类为元素添加 16px 的左边距:
w3-margin-left 类为元素添加 16px left 边距。
右边距
w3-margin-right 类为元素添加 16px 的右边距:
w3-margin-right 类向元素添加 16 像素的right 边距。
章节
许多 HTML 元素没有默认的顶部或底部边距。 这样的元素将在它们之间无边距地显示:
I am Blue
I am Green
w3-section 类可用于分隔元素。
它为任何 HTML 元素添加 16px 顶部和底部边距:
I am Blue
I am Green
实例
<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>
亲自试一试 »
