padding_元素边框与元素内容之间的空间

padding

元素边框与元素内容之间的空间

Padding（填充）属性定义元素边框与元素内容之间的空间。

介绍

当元素的 padding（填充）内边距被清除时，所释放的区域将会受到元素背景颜色的填充。单独使用 padding 属性可以改变上下左右的填充。

语法结构

注释：不允许使用负值。

浏览器支持

所有浏览器都支持 padding 属性。

注释：任何的版本的Internet Explorer （包括 IE8

可能的值

auto：浏览器计算外边距

length：规定以具体单位计的外边距值，比如像素、厘米等。默认值是 0px。

%：规定基于父元素的宽度的百分比的外边距。

inherit：规定应该从父元素继承外边距。

padding属性内边距的百分比数值

CSS padding 属性的百分比数值是相对于其父元素的 width 计算的，如果改变了父元素的 width，则它们也会改变。

语法

取值节

指定一个，两个，三个或四个下列的值：

形式语法

例子

CSS padding简洁写法

我们可以使用padding属性来设置四个方向的内边距。在实际编程中，我们往往使用的是padding的这种高效简洁写法来编程。

padding写法有3种，分别如下：

例如：

“padding:20px;”表示四个方向的内边距都是20px；

“padding:20px 40px;”表示padding-top和padding-bottom为20px，padding-right和padding-left为40px。

“padding:20px 40px 60px 80px;”表示padding-top为20px，padding-right为40px，padding-bottom为60px，padding-left为80px。大家按照顺时针方向记忆就可以了。

内外距离区别

margin与padding如何进行区分，这是很多学html人的困扰，其实说白了padding 就是内容与边框的空隙。而margin则是模块与模块的空隙。

参考资料

最新修订时间：2024-03-21 09:04

条目作者

概述

介绍

参考资料