W3.CSS 填充

w3-padding-large

我有 12px 的顶部和底部填充以及 24px 的左右填充。


W3.CSS 填充数字类

w3-padding-number 类向任何 HTML 元素添加顶部和底部填充:

定义
w3-padding-16 向元素添加 16px 顶部和底部填充
w3-padding-24 向元素添加 24px 顶部和底部填充
w3-padding-32 向元素添加 32px 顶部和底部填充
w3-padding-48 向元素添加 48px 顶部和底部填充
w3-padding-64 向元素添加 64px 顶部和底部填充

示例:

w3-padding-16

我有 16px 的顶部和底部填充

w3-padding-24

我有 24px 的顶部和底部填充

w3-padding-32

我有 32px 的顶部和底部填充

w3-padding-48

我有 48px 的顶部和底部填充

w3-padding-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-padding 添加 8px 顶部和底部,以及 16px 左右填充
w3-padding-small 添加 4px 顶部和底部,以及 8px 左右填充
w3-padding-large 添加 12px 顶部和底部,以及 24px 左右填充

示例:

w3-padding-small

我有 4px 顶部和底部填充和 8px 左右填充。

w3-padding

我有 8 像素的顶部和底部填充以及 16 像素的左右填充。

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>
亲自试一试 »