éléments « img » : bloquer niveau élément ou élément inline ?

Question

J’ai lu quelque part que les éléments IMG se comportent comme les deux. Si elle est correcte, quelqu'un pourrait s’il vous plaît m’expliquer avec des exemples ?

Answer 1

Il est vrai, ils sont tous deux - ou plus précisément, ce sont des éléments « inline-block ». Cela signifie qu’ils coulent inline comme texte, mais aussi ont une largeur et une hauteur comme éléments de bloc.

En CSS, vous pouvez affecter un élément `` pour la rendre à reproduire le comportement des images.

Images et objets sont également appelés éléments « remplacés », puisqu’ils n’ont pas de contenu en soi, l’élément est essentiellement remplacé par les données binaires.

Answer 2

Un élément est un .

Il se comporte comme un élément inline (parce que c’est), mais quelques généralisations concernant les éléments inline ne s’appliquent pas aux éléments img.

par exemple

Généralisation : « largeur ne s’applique pas aux éléments inline »

Ce que la spec a réellement dit : « s’applique à : tous les éléments mais éléments inline non remplacés, lignes de la table et les groupes de lignes "

Puisqu’une image est un élément inline remplacé, elle s’applique.

Answer 3

Les éléments IMG sont en ligne, ce qui signifie que sauf si elles sont lancées elles iront horizontalement avec texte et autres éléments inline.

Ils sont des éléments « bloc » qu’ils ont une largeur et une hauteur. Mais ils se comportent plus comme « inline-block » à cet égard.

Answer 4

Pour presque tous les think fins d'entre eux comme un élément inline avec une largeur définie. Fondamentalement, vous êtes libre de dicter comment vous souhaitez que les images à afficher à l’aide de CSS. J’ai mis généralement quelques classes d’image comme suit :