vertical - Affichage CSS: inline vs inline-block



inline html (1)

Éléments en ligne:

  1. respecter les marges et le rembourrage gauche et droit, mais pas le haut et le bas
  2. ne peut pas avoir un ensemble de largeur et de hauteur
  3. permettre aux autres éléments de s'asseoir à leur gauche et à droite.
  4. voir des notes secondaires très importantes sur ce sujet here .

Bloquer les éléments:

  1. respecter tous ceux
  2. forcer un saut de ligne après l'élément de bloc
  3. acquiert la pleine largeur si la largeur n'est pas définie

Eléments de blocage en ligne:

  1. permettre aux autres éléments de s'asseoir à leur gauche et à droite
  2. respecter les marges supérieure et inférieure et le rembourrage
  3. respecter la hauteur et la largeur

De W3Schools :

  • Un élément en ligne n'a pas de saut de ligne avant ou après, et il tolère les éléments HTML à côté de lui.

  • Un élément de bloc a des espaces au-dessus et au-dessous et ne tolère aucun élément HTML à côté de lui.

  • Un élément inline-block est placé en tant qu'élément en ligne (sur la même ligne que le contenu adjacent), mais il se comporte comme un élément de bloc.

Lorsque vous visualisez ceci, cela ressemble à ceci:

L'image est tirée de cette page , qui en dit aussi plus sur ce sujet.

Dupliquer possible:
Quelle est la différence entre display: inline et display: inline-block?

En CSS, l' display peut avoir des valeurs de inline et inline-block . Quelqu'un peut-il expliquer en détail la différence entre inline et inline-block ?

J'ai cherché partout, l'explication la plus détaillée me dit inline-block est placé en inline , mais se comporte comme un block . Mais cela n'explique pas ce que signifie exactement «se comporter en bloc». Est-ce une caractéristique spéciale?

Un exemple serait une réponse encore meilleure. Merci.





css