当前位置: 首页 > Web前端 > CSS

css实现居中布局(水平居中,垂直居中,水平居中)

时间:2023-03-31 00:26:20 CSS

水平居中内联元素:text-align:centerblockelementmargin:0auto;display:flex;justify-content:center;verticallycentereddisplay:flex;对齐项目:居中;行高:100px;水平和垂直居中

水平和垂直居中box元素有如下已知宽高positionon+margin.box{宽度:200px;高度:200px;背景:天蓝色;位置:绝对;左:50%;顶部:50%;左边距:-100px;margin-top:-100px;}宽高不清楚position+transform.box{left:50%;顶部:50%;转换:翻译(-50%,-50%);}flexlayout.box-wrapper{width:100vw;高度:100vh;显示:弹性;证明内容:居中;对齐项目:居中;}