flex布局实现可视窗口内的水平垂直居中

2024-10-12 02:33:13

1、新建html文件,命名为flex.html

flex布局实现可视窗口内的水平垂直居中

3、此时,添加需要垂直居中的子元素,在此添加一个div并添加文字。随后,为div标签设置边框,以便更好地观察效果。

flex布局实现可视窗口内的水平垂直居中

5、缩小浏览器可以看到,随着可视窗口的缩小,该框依旧是垂直居中的。

flex布局实现可视窗口内的水平垂直居中
猜你喜欢