内边距 (padding)

beyes · 发表于 2016-12-25 23:07:46

内容与边框之间的距离就是内边距，使用 padding 属性来控制，其属性值可以是长度值或百分比，但不能是负值。当值是百分数时，这个百分比是相对于父元素的 width 而言，如果父元素的 width 改变，它们也会随之变化。
可以通过 padding-top, padding-right, padding-bottom, padding-left 这 4 个属性分别控制上、右、下、左内边距。

无边距时：

[HTML] 纯文本查看 复制代码

<html>
<head>
<style type="text/css">
</style>
</head>

<body>
<table border="1">
<tr>
<td>
这个表格单元拥有下内边距。
</td>
</tr>
</table>
</body>

</html>

效果：

给出 2cm 的下边距描述时：

<style type="text/css">
td {padding-bottom: 2cm}
</style>

使用百分比的下边距描述：

td
{
padding-bottom: 10%
}

这个没有下边距描述时，表格宽度为 5.6cm；指定 10% 的下边距，也就是会有 0.56cm 的宽度。如上图，使用屏幕标尺工具可以测量知道，增加出来的下边距确实为 0.56cm 。

其它方向属性类似指定。

		自动登录	找回密码
密码			立即注册

[CSS] 内边距 (padding)

本帖子中包含更多资源

浏览过的版块