简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Maison > interface Web > tutoriel HTML > le corps du texte

html文本垂直居中对齐_html/css_WEB-ITnose

WBOY
Libérer： 2016-06-24 11:22:01
original
1772 Les gens l'ont consulté

html文本垂直居中对齐，代码如下：


    
      行1

      行2

      行3
   
    另一个span

实现原理：

1、首先设置div元素的高与行高为一样的值，这样在块内的行内元素就会垂直居中

2、设置span元素的显示，修改display为line-block,使其成为行内块元素

3、设置span的vertical-align为middle,以垂直居中，设置行高为1.2em，以改变继承的行高

 

Étiquettes associées：
html文本垂直居中对齐
source：php.cn
Article précédent：Atitit.css 规范 bem  项目中 CSS 的组织和管理_html/css_WEB-ITnose Article suivant：CSS：不同元素margin的计算_html/css_WEB-ITnose
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Derniers numéros
Déplacez le contenu vers la gauche en ajoutant la propriété Largeur J'ai prévu des marges au corps. main {gauche marge : 200px ; marge droite : 200px ; aligne...
Depuis 2024-04-06 22:01:35
0
3
816
Existe-t-il un moyen de forcer le texte de la flexbox à être centré verticalement, quel que soit l'autre code CSS dont nous disposons ? J'ai le code CSS suivant qui fait partie d'un code CSS plus vaste utilisé dans un site Web...
Depuis 2024-04-06 20:41:51
0
1
518
Titre du tableau pivoté verticalement, centré + aligné en bas, multi-navigateur J'ai un tableau avec des en-têtes pivotés qui ressemble à prévu dans Chrome, mais pas dans...
Depuis 2024-04-04 16:45:25
0
1
330
Je n'arrive pas à centrer quoi que ce soit sur l'écran Je suis un tutoriel YouTube sur la façon de créer une barre de navigation réactive sur HTM...
Depuis 2024-04-01 11:51:40
0
2
303
Impossible de centrer le texte en utilisant CSS + HTML J'essaie de centrer le texte en utilisant CSS et HTML. Je suis très nouveau dans le dévelo...
Depuis 2024-03-31 15:57:04
0
1
322
Rubriques connexes
Plus>
Recommandations populaires
Tutoriels populaires
Plus>
Tutoriels associés
Recommandations populaires
Derniers cours
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois：Formation PHP en ligne sur le bien-être public，Aidez les apprenants PHP à grandir rapidement！