在CSS中,我们经常会用到层(也叫做Div),而且我们可能需要设置两个层之间的距离,这可以通过padding属性来实现。
// HTML代码 <div class="layer1"> <div class="layer2"></div> </div> // CSS代码 .layer1 { background-color: #FFC0CB; // 设置背景颜色为粉色 padding: 30px; // 设置内边距为30像素 } .layer2 { background-color: #87CEFA; // 设置背景颜色为天蓝色 }
上面这段代码中,我们先创建了一个class名为”layer1”的层,然后在这个层中再创建了一个class名为”layer2”的层。我们要设置它们之间的距离,我们需要在.layer1中设置padding属性来实现。
padding属性用于设置一个元素的内边距,它可以分别设置上、右、下、左四个方向的内边距,也可以同时设置,每个方向的内边距值可以是像素、百分比或em。
在这个例子中,我们使用padding: 30px;设置了上下左右四个方向的内边距值都为30像素,这样就实现了layer1和layer2之间的距离。由于我们没有在.layer2中设置padding属性,所以layer2层不会产生任何内边距。