Bloc HTML et éléments en ligne | expliqué

Bloc HTML et éléments en ligne | expliqué
Les éléments de HTML peuvent être classés en deux catégories plus larges, en ligne et en blocs des éléments. Les éléments de blocage brisent le flux de contenu et démarrent une nouvelle ligne tandis que les éléments en ligne maintiennent le contenu dans la ligne et n'occupent qu'une quantité spécifique d'espace. Les éléments de blocs prennent autant d'espace que la largeur de l'élément parent et leur rupture de ligne étend également la page verticalement.

Comme HTML prend en charge une longue liste d'éléments, il peut être difficile pour un nouveau programmeur HTML pour les différencier. Gardant à la vue de l'importance, ce guide propose le résultat d'apprentissage suivant:

  • éclaire les différences entre les éléments de bloc et de ligne
  • démontrer plusieurs éléments de blocs et de lignes

Quelles sont les différences entre les éléments de bloc et de ligne

Voici les points de différenciation qui clarifieraient le concept d'éléments de blocs et de lignes en HTML.

  • Les éléments de bloc ajoutent de l'espace en brisant la ligne avant et après l'avoir utilisé. Tandis que les éléments en ligne sont pratiqués dans la ligne spécifique et ne consomment pas d'espace supplémentaire.
  • Les éléments en ligne ne prennent en charge que le rembourrage gauche et droit tandis que les éléments de bloc prennent en charge le rembourrage dans les directions verticales et horizontales
  • Les éléments en ligne prennent en charge les petits fichiers car ils créent de petites structures. Tandis que les éléments de bloc prennent en charge les fichiers volumineux car ils créent de grandes structures.
  • Lorsqu'un élément en ligne est appelé, il ne fonctionne que pour les fichiers exigeant cet élément en ligne. D'un autre côté, les éléments de bloc contiennent divers éléments de bloc et de ligne. Ainsi, lorsque l'élément de bloc parent est appelé, tous les éléments de bloc et de ligne qui y sont associés seraient appliqués.

Comment les éléments de blocs et de ligne fonctionnent-ils en HTML

Cette section fournit la fonctionnalité de plusieurs éléments de blocs et de lignes.

Éléments de blocs: Nous avons fourni l'applicabilité de quelques éléments de blocs en HTML qui montrent le comportement pratique des éléments de bloc.

En utilisant

: La balise de paragraphe dans HTML représente les lignes de texte et tombe dans la catégorie des éléments blocs de HTML.






Bloquer les éléments en HTML


c'est un paragraphe



La sortie du code HTML sur une page Web est fournie ci-dessous:+

Bien que le texte du paragraphe soit limité à quelques mots, cependant, la balise de paragraphe a pris une largeur complète (à partir de la page).

En utilisant : Passons en pratique la balise la plus importante et couramment utilisée en utilisant le code HTML suivant.






Bloquer les éléments en HTML


c'est un div



L'interface Web de la balise ci-dessus est indiquée ci-dessous:

Comme l'élément de bloc de paragraphe, la balise Div a également occupé toute la largeur de la page.

En utilisant

à l'intérieur : Comme indiqué et représenté plus tôt, les éléments de bloc occupent la largeur complète de la page (balise parent). Vous pouvez limiter la largeur de la balise parent et les étiquettes enfants occuperaient alors l'espace défini dans la balise parent. Par exemple, le code HTML suivant pratique le

faire étiqueter.






Bloquer les éléments en HTML



c'est une pargaraphe




Le code ci-dessus déclare une balise qui occupe 50% de la largeur de la page. UN

La balise est utilisée à l'intérieur de la balise et le paragraphe prend 50% de l'espace de son tag parent ().

À part et

, Plusieurs autres éléments de bloc sont décrits ci-dessous:
: utilisé pour représenter les coordonnées
: Le contenu de l'article peut être décrit en utilisant cette balise


: utilisé pour séparer le contenu par des lignes horizontales
: Légende de la figure est attribuée à l'aide de cette balise.

pour

: Ces étiquettes définissent l'en-tête de différentes tailles de

pour


: utilisé pour démarrer une nouvelle section
: Le pied de page d'une page ou d'une section peut être attribué
: peut être utilisé pour insérer une table dans HTML Doc.
    : Utilisé pour définir une liste commandée