css不固定寬高垂直置中的實現代碼

本文主要和大家分享css不固定寬高垂直置中的實現代碼，希望能協助到大家。一、父元素：display: flex;justify-content: center;align-items: center;二、父元素：position: relative;元素：transform: translate(-50%, -50%);position: absolute;top: 50%;left: 50%;三、   display: table;需要有一個中介層，垂直置中元素為第三層（1）父元素的父元素：display: table;父元素：display: table-cell;text-align: center;vertical-align: middle;元素：display: inline-block;（2）父元素的父元素：display: table;父元素：display: table-cell;vertical-align: middle;元素：margin: auto;