css中display：flex屬性實現元素垂直置中的代碼

這篇文章給大家介紹的內容就是關於css中display：flex屬性實現元素垂直置中的代碼，有一定的參考價值，有需要的朋友可以參考一下，希望對你有所協助。

在此之前元素垂直置中我使用的是絕對位置absolute或固定定位fixed

如何用flex實現元素垂直置中呢，父級包括子級

<div  class='itemBox'>    <div>boxboxboxboxboxboxboxboxboxboxbox</div></div> .itemBox{display: flex;justify-content: center;align-items: center;background: #588cfe;width: 100%;height: 100vh;}.itemBox p{background: #ffffff;width: 200px;height: 200px;word-break: break-all;//英文超出盒子不換行問題}