hauteur de vs ligne-taille de style

Quelle est la différence entre l'utilisation de ces deux lorsque l'on traite avec du texte qui ne sera jamais plus qu'une seule ligne? Ils ont tous deux peuvent produire des résultats similaires sur l'écran de ce que je peux voir en ce qui concerne les éléments sur haut ou sur le bas de l'élément. Pourquoi utiliser la ligne de hauteur à tous, si oui? Hauteur serait plus logique à utiliser.

Edit: Un exemple de ce stylisé bouton créé à partir d'un div avec du texte à l'intérieur. Ce ne sera jamais multiligne. Serait line-height être nécessaire pour des raisons de compatibilité? ou quoi que ce soit je ne le sais pas?

Merci!

InformationsquelleAutor EverTheLearner | 2011-09-30
  1. 25

    height est à la verticale de mesure du conteneur.

    line-height est la distance entre le haut de la première ligne de texte en haut
    de la seconde.

    Si elle est utilisée avec une seule ligne de texte, je m'attends à produire des résultats similaires dans la plupart des cas.

    - Je utiliser height quand je veux définir explicitement la taille du conteneur et line-height pour typographiques de mise en page, où il pourrait être pertinent si l'utilisateur redimensionne le texte.

    • La Correction. la hauteur de la ligne n'a rien à voir avec le cas d'une deuxième ligne de texte est et n'est basé que sur la ligne de la boîte de lui-même.
    • Voici un autre tutoriel avec l'exemple de css-tricks, si ça fait plus de sens.
    InformationsquelleAutor Dennis Traub
  2. 20

    Si vous encapsuler le texte dans un div, donner la div une hauteur, et le texte pousse à 2 lignes (peut-être parce qu'il est affiché sur un petit écran comme un téléphone), puis le texte se chevauchent avec les éléments ci-dessous il. D'autre part, si vous donnez la div a la hauteur de la ligne et le texte se développe à 2 lignes, la div va s'agrandir (en supposant que vous n'avez pas de donner également à la div de hauteur).

    Ici est un violon que le démontre.

    • Débarqué sur DONC, après la lecture de ceci. DwB la réponse doit avoir de façon plus upvotes.
    InformationsquelleAutor DwB
  3. 0

    Pour des raisons pratiques, dans le cas que vous citez (jamais d'habillage pour plus d'une ligne) la ligne de hauteur à la verticale du centre du texte. Soyez prudent à propos de cette hypothèse, bien que l'utilisateur contrôle la taille de police.

    InformationsquelleAutor steveax
  4. 0

    En supposant que le texte est plus petit que le conteneur:

    Réglage de la hauteur de la ligne sur le conteneur spécifie la hauteur minimale d'une ligne de boîtes à l'intérieur d'elle. Pour 1 ligne de texte, le texte centré verticalement à l'intérieur du conteneur.

    Si vous réglez la hauteur du conteneur, le conteneur va croître verticalement, mais le texte à l'intérieur, il va commencer sur la première (en haut) de la ligne à l'intérieur.

    InformationsquelleAutor Stephan van Hoof
  5. 0

    hauteur = la hauteur de la ligne + padding-top + padding-bottom

    InformationsquelleAutor Alexis Gamarra