css两行的距离 |加载更多 css

.example {
margin-top: 10px;
margin-bottom: 20px;
}

上面的代码将给class为“example”的元素设置一个上边缘与其周围元素的距离为10像素，下边缘与其周围元素的距离为20像素。同样，大家可以设置左右边缘与其周围元素的距离。

除了margin属性，还有一种方法是使用CSS的padding属性。padding属性可以调整元素内部内容与其边缘之间的距离。

.example {
padding-top: 10px;
padding-bottom: 20px;
}

上面的代码将给class为“example”的元素设置一个内部内容与其上边缘之间的距离为10像素，内部内容与其下边缘之间的距离为20像素。同样，大家可以设置左右内边距。

需要注意的是，margin和padding属性都可以使用“不同方向间距”的语法，例如：margin: 10px 5px 20px 5px;表示上、右、下、左四个方向的间距分别为10像素、5像素、20像素、5像素。

最后，大家需要注意的是，距离不会叠加。例如，如果一个元素的margin-top为10像素，另一个元素的margin-bottom为20像素，则它们之间的距离并不是30像素，而是20像素，因为它们之间的距离是由它们的边缘中最大的那个决定的。