[Web] CSS: pading(内边距)简写时的赋值顺序

2025-05-22 04:57:42

如下是 CSS 中内咐搭趔涮边距的设置:

padding-top: 4px

padding-bottom: 12px

padding-left: 4px

padding-right: 12px

--------------------------------------------------------------------

为了使代码更加简洁, 我们进行简写, 达到相同的功能.

当[上,下]等宽, [左,右]等高时,可以简写为:

padding: 4px 12px; /*第一个值对应[上,下]的高度, 第二个值对应[左,右] */

如果只有[上,下]或[左,右]有一面是等高,或等宽时:

padding: 4px 12px 4px; /* 分别对应[上, 右, 下],由于没有第四个量, 也就是默认[左]为缺省, 与[右]采用同样宽度, 即12px. */

如果, [上,右,下,左] 距离都不相等时, 则要设置4个值

padding: 4px 12px 4px 12px; /* [上,右,下,左], 赋值顺序为顺时针. */

如果只有一个量:

padding: 4px; /* 这意味着[上,右,下,左]的宽度是相等的, 都为4px *

声明:本网站引用、摘录或转载内容仅供网站访问者交流或参考,不代表本站立场,如存在版权或非法内容,请联系站长删除,联系邮箱:site.kefu@qq.com。
猜你喜欢