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 类为元素添加 16px 的顶部外边距。
底部外边距
w3-margin-bottom 类为元素添加 16px 的底部外边距
w3-margin-bottom 类为元素添加 16px 的底部外边距。
左侧外边距
w3-margin-left 类为元素添加 16px 的左侧外边距
w3-margin-left 类为元素添加 16px 的左侧外边距。
右侧外边距
w3-margin-right 类为元素添加 16px 的右侧外边距
w3-margin-right 类为元素添加 16px 的右侧外边距。
区块
许多 HTML 元素默认没有顶部或底部外边距。这些元素会显示为没有间距。
我是蓝色
我是绿色
w3-section 类可用于分隔元素。
它会为任何 HTML 元素添加16px 的顶部和底部外边距
我是蓝色
我是绿色
示例
<div class="w3-container w3-section w3-blue">
<h1>我是蓝色</h1>
</div>
<div class="w3-container w3-section w3-green">
<h1>我是绿色</h1>
</div>
自己试试 »