#padding

#介绍

指定一个元件内容与内边界的距离，该属性不能为负值。

是 padding-top、padding-right、padding-bottom、padding-left 的简写。

#使用示例

css-apisrc/padding/App.tsx

预览

#语法

/* Apply to all four sides */
padding: 1em;

/* top and bottom | left and right */
padding: 5% 10%;

/* top | left and right | bottom */
padding: 1em 2em 2em;

/* top | right | bottom | left */
padding: 5px 1em 0 2em;

padding 属性接受 1~4 个值。每个值可以是 <length> 或 <percentage>。取值不能为负。

当只指定一个值时，该值会统一应用到全部四个边的内边距上。 指定两个值时，第一个值会应用于上边和下边的内边距，第二个值应用于左边和右边。 指定三个值时，第一个值应用于上边，第二个值应用于右边和左边，第三个则应用于下边的内边距。 指定四个值时，依次（顺时针方向）作为上边，右边，下边，和左边的内边距。

#取值

#0px

默认值。

#<length>

<length> 定义为一个绝对值。不能为负值。

#<percentage>

相对于包含块的行内尺寸（宽度）的百分比。必须是非负值。

#形式定义

#形式语法

padding =
  <'padding-top'>{1,4}

<padding-top> =
  <length-percentage [0,∞]>

<length-percentage> =
  <length>      |
  <percentage>

#兼容性