css定义补白区域实例 |css3 3d楼梯

下面是一个简单的实例代码：

.box {
width: 200px;
height: 100px;
background-color: #f00;
padding: 20px;
}

上面的代码定义了一个宽为200像素、高为100像素、背景颜色为红色的盒子。并且给这个盒子设置了上、右、下、左各20像素的内边距。

这样，这个盒子的实际宽度就是240像素（200 + 20 + 20），高度是140像素（100 + 20 + 20）。而盒子中的内容则会距离盒子边框20像素。

如果只想定义上下或左右两个方向的内边距，也可以使用padding-top、padding-right、padding-bottom、padding-left这四个属性。例如：

.box {
width: 200px;
height: 100px;
background-color: #f00;
padding-top: 20px;
padding-bottom: 20px;
}

上面的代码定义了一个宽为200像素、高为100像素、背景颜色为红色的盒子。并且给这个盒子设置了上下各20像素的内边距。

这样，这个盒子的实际宽度仍然是200像素，高度是140像素（100 + 20 + 20）。而盒子中的内容则会距离盒子上下边框20像素。