CSS外边距怎么写?
CSS外边距是指元素边框与相邻元素之间的距离。外边距有四个方向:上、右、下、左。在CSS中,可以使用margin属性来设置外边距。
margin属性可以设置多个值,例如,设置上下边距为10像素,左右边距为20像素,可以使用以下代码:
p { margin: 10px 20px; }上述代码中,10px表示上下边距,20px表示左右边距。如果想要设置不同的边距,可以将四个值分别设置,例如:
p { margin-top: 10px; margin-right: 20px; margin-bottom: 30px; margin-left: 40px; }上述代码中,分别设置了上、右、下、左四个方向的边距为10px、20px、30px、40px。 除了使用具体数值外,还可以使用百分比来设置边距。例如,设置上下边距为设备视口高度的20%,可以使用以下代码:
p { margin-top: 20vh; margin-bottom: 20vh; }上述代码中,vh表示视口高度的百分之一。 除此之外,还可以使用auto关键字来自动计算外边距。例如,在一个固定宽度的块级元素中,想要让该元素水平居中,可以使用以下代码:
.container { width: 80%; margin: 0 auto; }上述代码中,将左右边距设为auto,浏览器会自动计算左右边距,使该元素水平居中。 总之,CSS外边距的设置方式多种多样,可以根据实际需求选择合适的方法。