在前端开发中,居中样式是很常见也很重要的一种样式。如何实现居中样式呢?今天我们来一起学习一下。首先是水平居中。我们可以通过以下代码实现:p { text-align: center; } 这段代码会让
p { text-align: center; }
div { width: 200px; margin-left: auto; margin-right: auto; }
p { height: 100px; line-height: 100px; /* 行高和容器高度相等 */ }
div { position: relative; top: 50%; height: 200px; margin-top: -100px; /* 高度的一半 */ }
.container { display: flex; justify-content: center; /* 水平居中 */ align-items: center; /* 垂直居中 */ }
粉丝
0
关注
0
收藏
0