Je me souviens d'une question posée par l'intervieweur lors de l'entretien d'embauche précédent: quels sont les éléments de l'industrie et quelle est la différence entre eux et les éléments au niveau du bloc? Il s'agit d'une question d'interview très basique, mais de nombreux débutants ne se concentrent généralement que sur la sémantique des étiquettes et ignorent les caractéristiques des étiquettes à l'intérieur et du niveau de bloc. Par conséquent, il est très probable que les questions ci-dessus ne puissent pas répondre ou répondre de manière incomplète.
Les éléments en ligne courants en HTML sont:<span>, <a>, <img>, <fort>, <TextArea>, <lect>, <bellise>
Il comprend également certains éléments de texte tels que: <br>, <b>, <strong>, <p>, <bout>, <i>, <em>, <el>, <u>, etc.
Si vous ne répondez que <span> et <img>, ce serait déraisonnable.
Les éléments communs au niveau du bloc en HTML sont:<div>, <s table>, <form>, <p>, <ul>,
<h1> ...... <h6>, <hr>, <pre>, <adress>, <9 Center>, <Marquee>, <ChockQuote>, etc.
Si vous ne répondez que <v>, ce serait déraisonnable.
Alors, quelle est la différence entre eux?Éléments au niveau des blocs
1. Commencez toujours par une nouvelle ligne, c'est-à-dire que chaque élément au niveau du bloc prend une ligne et est organisé verticalement vers le bas par défaut;
2. La hauteur, la largeur, la marge et le rembourrage sont tous contrôlables, avec des paramètres efficaces et des effets de marge;
3. Lorsque la largeur n'est pas définie, la valeur par défaut est à 100%;
4. Les éléments au niveau du bloc peuvent contenir des éléments au niveau du bloc et des éléments en ligne.
· Éléments en ligne
1. C'est dans la même ligne que les autres éléments, c'est-à-dire que les éléments de la ligne et d'autres éléments de la ligne seront disposés sur une ligne horizontale;
2. La hauteur et la largeur sont incontrôlables et les paramètres ne sont pas valides et déterminés par le contenu.
La marge de réglage est efficace à gauche et à droite, avec un effet de marge;
Le réglage de la marge prendra en charge l'espace de haut en bas ne produira pas d'effets de marge (c'est-à-dire que la marge-top / le bas a des valeurs sur le modèle de boîte, mais il n'y a pas d'effet de marge sur la page).
La définition du rembourrage à gauche et à droite est efficace. La mise en place de rembourrage de haut en bas agrandira l'espace mais ne produira pas un effet de marge (comme ci-dessus).
L'effet de rembourrage est montré comme suit:
<! Doctype html> <html> <éadf> <meta charset = utf-8> </ad> <style> span {border: 1px solide rouge; padding: 10px;} div {border: 1px Blue solide;} </ style> </ body> élément de niveau de bloc </px élément en ligne </pan> <pander> élément in- line <pan> <pan> en ligne </pan> <pander> élément in- line <pan> <pan> en ligne </pan> <pander> élément in- line <pan> <pan> en ligne élément </pan> <pander> élément in- line <pan> <pander> en ligne </pan> <pander> élément insigne élément </div> </ body> </html>3. Selon le concept de sémantique de label, il est préférable d'inclure uniquement des éléments en ligne et non des éléments au niveau des blocs.
ConvertirBien sûr, les caractéristiques entre les éléments au niveau du bloc et les éléments en ligne peuvent être converties les unes aux autres. Le HTML peut diviser les éléments en trois types: éléments en rangée, éléments de bloc et éléments de blocs en rangée.
Utilisez l'attribut d'affichage pour convertir les trois en conversion arbitraire:
(1) Affichage: en ligne; convertir en éléments en ligne;
(2) Affichage: bloc; Convertir en éléments bloqués;
(3) Affichage: bloc en ligne; Convertir en éléments de bloc en ligne.
Les éléments de bloc en ligne combinent les caractéristiques des éléments en ligne et les éléments en ligne:(1) Si l'enveloppe de ligne n'est pas automatiquement emballée, elle sera disposée sur une ligne horizontale avec d'autres éléments de ligne;
(2) la hauteur, la largeur, la marge et le rembourrage sont tous contrôlables, avec des paramètres efficaces et des effets de marge;
(3) La disposition par défaut est de gauche à droite.
C'est la fin de cet article sur les détails des différences entre les éléments HTML et les éléments au niveau du bloc. Pour des éléments HTML plus liés et des éléments au niveau des blocs, veuillez rechercher des articles précédents de Wulin.com ou continuer à parcourir les articles connexes ci-dessous. J'espère que tout le monde soutiendra Wulin.com à l'avenir!