Maison > Article > interface Web > Comment puis-je faire en sorte que img et span soient centrés verticalement dans un div ?
Comment puis-je faire en sorte que img et span soient centrés verticalement dans un div ?
- php中世界最好的语言original
- 2018-01-20 09:59:137438parcourir
Cette fois, je vais vous montrer comment centrer verticalement img et span dans un div Quelles sont les précautions pour centrer verticalement img et span dans un div ? Ce qui suit est un cas pratique, jetons un coup d'œil.
<html>
<head>
<style>
#test *{vertical-align:middle;}
</style>
<body>
<div
id="test">
<img
src="http://127.0.0.1:7001/wsc/images/message.png"/>
<span>sdfhsdhfdksfjhtes:</span>
</div>
</body>
</html>Veuillez noter : #test *{vertical-align:middle;}s
#test * représente tous les éléments du div, y compris les éléments span, input et img. .
alignement vertical
Valeur initiale : ligne de base (valeur par défaut)
Héritable : Non
Applicable à : éléments en ligne
Description : alignement vertical : la ligne de base crée l'élément La ligne de base est aligné avec la ligne de base de l’élément parent.
Attention : l'alignement vertical ne peut pas affecter l'alignement du contenu dans les cellules du tableau, ni le contenu des éléments de bloc.
Veuillez noter : l'alignement vertical n'affecte que les éléments en ligne, tels que span, img, em, input, a, etc., mais n'est pas valide pour les éléments de bloc tels que div, h3, p, etc.
Je pense que vous maîtrisez les méthodes après avoir lu ces cas. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !
Lecture connexe :
Comment utiliser le serveur sse de h5 pour envoyer des événements EventSource
Le stockage local de H5 et les détails de la base de données locale Introduction
Utiliser H5 et C3 pour obtenir un effet d'horloge simple
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!