水平垂直居中的几种方式
    1. 使用CSS的flexbox布局。在包含居中元素的父容器上设置display:flex和justify-content:center、align-items:center即可实现水平垂直居中。
2. 使用table-cell和vertical-align属性。将父容器设置display:table和height:100%,将居中元素设置display:table-cell、vertical-align:middle和text-align:center即可实现水平垂直居中。
3. 使用绝对定位和transform属性。将父容器设置position:relative,将居中元素设置position:absolute、top:50%、left:50%和transform:translate(-50%,-50%)即可实现水平垂直居中。
css设置文字垂直居中
4. 使用视口单位和transform属性。将父容器设置position:relative和height:100vh,将居中元素设置position:absolute、top:50vh、left:50vw和transform:translate(-50%,-50%)即可实现水平垂直居中。

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。