Code pour l'affichage : attribut flex en CSS pour implémenter le centrage vertical des éléments

Cet article vous présente l'attribut display: flex en CSS pour implémenter le code de centrage vertical des éléments. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer.

Avant cela, j'utilisais le positionnement absolu ou le positionnement fixe fixe

Comment utiliser flex pour centrer verticalement les éléments, le parent inclut l'enfant

<div  class=&#39;itemBox&#39;>
    <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;//英文超出盒子不换行问题
}

Articles connexes recommandés :

Code pour la conversion de chaîne à l'aide de l'attribut text-transform en CSS

Deux façons d'utiliser les tableaux en CSS (exemples)

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!