Maison  >  Article  >  interface Web  >  Quels sont les éléments en ligne et les éléments en ligne du HTML ? Introduction aux caractéristiques des éléments html inline et des éléments inline

Quels sont les éléments en ligne et les éléments en ligne du HTML ? Introduction aux caractéristiques des éléments html inline et des éléments inline

寻∝梦
寻∝梦original
2018-08-14 16:23:043751parcourir

Quels sont les éléments en ligne du HTML ? Quels sont les éléments contenus dans un bloc HTML ? Cet article présente quels sont les éléments en ligne et lesquels sont les éléments au niveau du bloc, leurs caractéristiques et leurs différences.

Caractéristiques des éléments HTML en ligne :

Les éléments en ligne sont également appelés éléments en ligne ou éléments incorporés. Les éléments en ligne et les autres éléments sont tous sur la même ligne et la hauteur, la hauteur de ligne, le remplissage et les marges ne peuvent pas être modifiés. La largeur est la largeur de son texte ou de son image et elle ne peut pas être modifiée. Les éléments en ligne ne peuvent contenir que du texte ou d'autres éléments en ligne.

Les a, img, br mentionnés dans l'article précédent sont des éléments en ligne.

Caractéristiques des éléments de bloc :

① commence toujours sur une nouvelle ligne

② la hauteur, la hauteur de la ligne, les marges et le remplissage peuvent être contrôlés ;

③La largeur par défaut est de 100 % de son conteneur, sauf si une largeur est définie

④Il peut accueillir des éléments en ligne et d'autres éléments de bloc ;

Caractéristiques des éléments en ligne :

① et les autres éléments sont sur la même ligne

② hauteur, hauteur de ligne et marges extérieure et intérieure L'espacement ne peut pas être modifié ;

③La largeur est la largeur de son texte ou de son image et ne peut pas être modifiée

④Les éléments en ligne ne peuvent accueillir que du texte ou d'autres éléments en ligne.

Remarque sur les éléments en ligne et les éléments de bloc :

Selon la spécification CSS, chaque élément de page Web a un attribut d'affichage est utilisé pour déterminer le type de l'élément. Chaque élément a une valeur d'attribut d'affichage par défaut. Par exemple, un élément div a une valeur d'attribut d'affichage par défaut de « block » et devient un élément « de niveau bloc » et l'attribut d'affichage par défaut. La valeur de l'élément span est "inline", ce qui est appelé élément "inline". Les éléments au niveau du bloc tels que div occuperont automatiquement un certain espace rectangulaire. L'apparence de ce rectangle peut être ajustée en définissant des attributs tels que la hauteur, la largeur, les marges intérieures et extérieures, au contraire, des éléments en ligne tels que "span" ; et "a" Les éléments n'ont pas leur propre espace indépendant. Ils existent attachés à d'autres éléments de niveau bloc. Par conséquent, la définition d'attributs tels que la hauteur, la largeur et les marges intérieures et extérieures sur les éléments en ligne n'est pas valide.

La différence entre les éléments en ligne et les éléments de bloc :

(1) Les éléments de niveau bloc occuperont une ligne exclusive et leur largeur remplira automatiquement la largeur de leur. élément parent

Les éléments en ligne n'occuperont pas une ligne exclusive. Les éléments en ligne adjacents seront disposés sur la même ligne. Ils ne s'enrouleront pas tant qu'une ligne ne pourra pas tenir. La largeur changera avec le contenu de l'élément

(2). Dans des circonstances normales, les éléments au niveau du bloc peuvent définir les attributs de largeur et de hauteur, et les éléments en ligne qui définissent la largeur et la hauteur ne sont pas valides

(Remarque : même si la largeur d'un bloc- l'élément de niveau est défini, il occupe toujours une ligne exclusive)

(3) .Les éléments de niveau bloc peuvent définir la marge et le remplissage horizontaux, padding-right, margin-left et margin-right. des éléments en ligne produisent tous des effets de marge, mais les champs padding-top et padding-bottom verticaux, ni margin-top ni margin-bottom, ne produiront des effets de marge. (La direction horizontale est valide, la direction verticale n'est pas valide)

Que sont les éléments de ligne et les éléments de bloc :

Élément de bloc (élément de bloc)

adresse - adresse

blockquote - bloc citation

centre - bloc d'alignement

dir - liste de répertoires

div - bloc commun Le niveau est facile, et c'est aussi la balise principale de la mise en page CSS

dl - liste de définitions

fieldset - groupe de contrôle de formulaire

formulaire - formulaire interactif

h1 - titre

h2 - sous-titre

h3 - titre niveau 3

h4 - titre niveau 4

h5 - titre niveau 5

h6 - En-tête de niveau 6

hr - ligne de séparation horizontale

menu - liste de menus

noframes - cadres de contenu facultatif, (afficher ce contenu de bloc pour les navigateurs qui ne le font pas supports frames

noscript - contenu du script facultatif (afficher ce contenu pour les navigateurs qui ne prennent pas en charge le script)

ol - formulaire de tri

p - paragraphe

pre - Texte formaté

able - Tableau

ul - Liste non triée

élément en ligne (élément en ligne)

a - Ancre

abbr - Abréviation

acronyme - Premier mot

b - Gras (non recommandé)

big - Grande police

br - Saut de ligne

cite - Citation

code - Code informatique (obligatoire lors de la citation du code source)

dfn - Champ de définition

em - emphase

police - paramètre de police (non recommandé)

i - italique

img - image

saisie - zone de saisie

kbd - définir le texte du clavier

étiquette - étiquette du tableau

q - citation courte

s - trait de soulignement (non recommandé)

samp - Définir un exemple de code informatique

select - Sélection d'éléments

small - Texte en petite police

span - Conteneurs en ligne couramment utilisés, définir des blocs dans le texte

frapper - souligner

strong - accent gras

sub - indice

sup - exposant

textarea - zone de saisie de texte multiligne

tt - texte télex

u - souligner

var - définir des variables

[Recommandations associées]

HTML5 Qu'est-ce que c'est et quels sont les fonctionnalités, avantages et inconvénients du HTML5 ?

Éléments de base du HTML, permettant d'apprendre le HTML à partir de zéro

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
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