Maison  >  Article  >  interface Web  >  Élément de bloc élément de bloc et élément en ligne élément en ligne_CSS/HTML

Élément de bloc élément de bloc et élément en ligne élément en ligne_CSS/HTML

WBOY
WBOYoriginal
2016-05-16 12:11:481335parcourir

Une tentative a été faite pour insérer un élément de niveau bloc dans un élément de niveau en ligne. Ceci n'est pas autorisé. La seule exception à la possibilité d'insérer des éléments de niveau bloc dans des éléments en ligne est la balise object. Alors, que sont les éléments de niveau en ligne et les éléments de niveau bloc ? .

Les éléments de bloc sont généralement des éléments conteneurs pour d'autres éléments. Les éléments de bloc commencent généralement sur une nouvelle ligne. Ils peuvent accueillir des éléments en ligne et d'autres éléments de bloc. Un élément de bloc courant est la balise de paragraphe « P ». " L'élément de bloc est spécial. Il ne peut être utilisé que pour accueillir d'autres éléments de bloc.

Sans la fonction CSS, les éléments de bloc seront disposés une ligne à la fois. Après avoir utilisé CSS, nous pouvons modifier la valeur par défaut mode de mise en page de ce code HTML et placez les éléments de bloc là où vous le souhaitez. Au lieu de commencer bêtement une nouvelle ligne à chaque fois, il convient de souligner que la balise table est également un élément de bloc. Premièrement, du point de vue des utilisateurs ordinaires (sauf visuellement). personnes handicapées, aveugles, etc.), il n'y a pas d'autre différence entre la mise en page basée sur un tableau et la mise en page basée sur CSS, à l'exception de la différence de vitesse de chargement des pages. Mais si c'est ordinaire, après que l'utilisateur a cliqué par inadvertance sur le bouton d'affichage du code source de la page, La différence entre les deux est très grande. Le code source de la page de mise en page CSS conçu sur la base de bons concepts de reconstruction peut au moins permettre aux utilisateurs ordinaires sans expérience en développement Web de visualiser rapidement le contenu. De ce point de vue, le code de mise en page CSS devrait avoir une meilleure compréhension. expérience esthétique.

Vous pouvez imaginer l'élément conteneur de bloc div comme une boîte, ou si vous avez joué avec le découpage, ce sera plus facile à comprendre. Nous découpons d'abord les articles requis dans divers journaux et. magazines. Le contenu de chaque coupe est un bloc, puis nous utilisons de la colle pour réorganiser ces morceaux de papier selon notre propre intention de mise en page. Collez-le sur un nouveau morceau de papier vierge. Cela crée votre propre résumé unique. technique, la conception de la mise en page Web suit également le même modèle.

Éléments en ligne (Les éléments en ligne sont généralement basés sur des éléments de base au niveau sémantique. Les éléments en ligne ne peuvent accueillir que du texte ou d'autres éléments en ligne. L'élément en ligne commun "a ".

L'élément bloc et l'élément en ligne sont tous deux des concepts de la spécification HTML. La différence fondamentale entre les éléments block et les éléments inline est que les éléments block commencent généralement sur une nouvelle ligne. Lorsque le contrôle CSS est ajouté, cette différence d'attribut entre les éléments de bloc et les éléments en ligne ne devient plus une différence. Par exemple, nous pouvons ajouter un attribut tel que display:block à l'élément en ligne cite, afin qu'il ait également l'attribut de commencer à partir d'une nouvelle ligne à chaque fois.


Le concept de base d'un élément variable est qu'il doit déterminer si l'élément est un élément de bloc ou un élément en ligne en fonction du contexte. Les éléments variables appartiennent toujours aux deux catégories d'éléments ci-dessus. Une fois que le contexte a déterminé sa catégorie, il doit suivre les règles des éléments de bloc ou des éléments en ligne. Voir le texte intégral pour la classification approximative des éléments.

ps : Concernant le nom chinois de l'élément en ligne, il existe de nombreux types d'éléments en ligne, éléments en ligne, éléments en ligne et éléments en ligne. Fondamentalement, il n’existe pas de traduction unifiée, appelez-la simplement comme vous voulez. De plus, lorsque l'on parle d'éléments en ligne, nous penserons à un attribut d'affichage appelé display:inline ; cet attribut peut résoudre le fameux problème de double bordure flottante d'IE.

élément de bloc
* adresse - adresse
* blockquote - citation de bloc
* centre - bloc d'alignement
* dir - liste de répertoires
* div - Les niveaux de bloc couramment utilisés sont facile et sont également les balises principales de la mise en page CSS
* dl - Liste de définitions
* champset - groupe de contrôle de formulaire
* formulaire - Formulaire interactif
* h1 - Gros titre
* h2 - Sous-titre
* h3 - Titre niveau 3
* h4 - Titre niveau 4
* h5 - Titre niveau 5
* h6 - Titre niveau 6
* hr - Ligne de démarcation horizontale
* isindex - invite de saisie
* menu - liste de menus
* noframes - contenu facultatif des cadres, (pour les navigateurs qui ne prennent pas en charge les cadres, affichez ce contenu de bloc
* noscript -) contenu de script facultatif (pour les navigateurs qui ne prennent pas en charge cadres de support) Les navigateurs qui ne prennent pas en charge le script afficheront ce contenu)
* ol - formulaire trié
* p - paragraphe
* texte pré-formaté
* tableau - tableau
* ul - liste non triée

Élément en ligne
* a - Point d'ancrage
* abbr - Abréviation
* acronyme - Premier mot
* b - Gras (non recommandé)
* bdo - bidi override
* big - big font
* br - saut de ligne
* cite - citation
* code - code informatique (obligatoire pour citer le code source)
* dfn - Définir le champ
* em - Emphase
* police - Paramètre de police (non recommandé)
* i - Italique
* img - Image
* saisie - Zone de saisie
* kbd - Définir le texte du clavier
* label - label du tableau
* q - citation courte
* s - trait de soulignement (non recommandé)
* samp - définir un exemple de code informatique
* select - sélection de projet
* small - small texte de police
* span - conteneur en ligne couramment utilisé, définissant des blocs de texte
* barré - souligné
* fort - accent gras
* sub - bas Superscript
* sup - Superscript
* textarea - Zone de saisie de texte multiligne
* tt - Texte télex
* u - Souligné
* var - Définir une variable

Éléments variables
Les éléments variables déterminent si l'élément est un élément block ou un élément en ligne selon le contexte.

* applet - applet java
* bouton - bouton
* del - supprimer le texte
* iframe - cadre en ligne
* ins - texte inséré
* carte - bloc d'image (carte)
* objet - objet objet
* script - script client

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