Quelles sont les trois catégories de balises html5 ?

Trois types de balises HTML5 : 1. Les éléments de niveau bloc, dont la valeur d'affichage est "block", se caractérisent par la possibilité de définir la largeur, la hauteur, les marges et le retour à la ligne automatique. 2. les éléments en ligne, dont la valeur d'affichage est ; "inline", Il ne s'enroulera pas automatiquement et la largeur et la hauteur ne peuvent pas être définies ; 3. Les éléments de bloc en ligne ne s'enrouleront pas automatiquement et la largeur et la hauteur peuvent être définies.

L'environnement d'exploitation de ce tutoriel : système Windows7, version CSS3&&HTML5, ordinateur Dell G3.

Classification des balises html5

les balises sont également appelées éléments

• Selon les caractéristiques des balises, elles peuvent être divisées en : balises de bloc, balises en ligne (inline), balises de bloc en ligne

• Selon règles de fermeture des balises , peuvent être divisées en : étiquette simple (étiquette vide, étiquette à fermeture automatique), étiquette double

Éléments de bloc couramment utilisés :

 : i>

Éléments de bloc en ligne couramment utilisés : block Caractéristiques des éléments de niveau :

display:<p><code class="marker">block;

display:<strong><code class="marker">block;

1、每个块级元素都从新的一行开始，并且其后的元素也另起一行。

2、元素的高度、宽度、行高以及上下左右的margin、padding值都可设置。

3、元素宽度在不设置的情况下，是它本身父容器的100%（和父元素的宽度一致），除非设定一个宽度。

行内元素特点：display:inline;

1、和其他元素都在一行上；

2、元素的高度、宽度及顶部和底部边距不可设置（只支持左右方向的margin、padding）；

3、元素的宽度就是它包含的文字或图片的宽度，不可改变。

行内块状元素的特点：display:inline-block;

1、和其他元素都在一行上；

2、元素的高度、宽度、行高以及顶和底边距都可设置。（支持上下左右的margin、padding值）

3、margin:0 auto无效

4、水平排列，但所有元素默认会有1个空格的间隙，因为元素之间在html中书写有回车换行，浏览器解析会将其解析成一个空格。

标记类型的转换

标签的类型是可以转换的：

• 设置display:inline 转换为行内元素

• 设置display:linline-block 转换为行内块元素

• 设置display:block1. mis à jour à partir du nouveau Commence une ligne et les éléments qui la suivent démarrent également une nouvelle ligne.

2. La hauteur, la largeur, la hauteur de ligne de l'élément, ainsi que les valeurs de marge et de remplissage du haut, du bas, de la gauche et de la droite peuvent être définies.

3. Lorsqu'elle n'est pas définie, la largeur d'un élément est 100 % de son conteneur parent (la même que la largeur de l'élément parent), sauf si une largeur est définie. Caractéristiques des éléments en ligne :

display:inline🎜🎜🎜;🎜🎜🎜🎜1, et les autres éléments sont sur la même ligne 🎜🎜2. Hauteur🎜, Largeur🎜 et marges supérieure et inférieure🎜 ne peuvent pas être définis🎜🎜 ( uniquement la marge et le remplissage pris en charge dans les directions gauche et droite) ; 🎜🎜3. La largeur d'un élément est la largeur du texte ou de l'image qu'il contient et ne peut pas être modifiée. 🎜🎜🎜🎜Caractéristiques des éléments de bloc en ligne : display:inline-block;🎜🎜🎜🎜1, et les autres éléments sont sur la même ligne ; 🎜🎜2, 🎜La hauteur, la largeur, la hauteur de ligne ainsi que les marges supérieure et inférieure de l'élément peuvent être définies. 🎜🎜 (Prend en charge les valeurs de marge et de remplissage​​haut, bas, gauche et droite) 🎜🎜3. Marge : 0 auto n'est pas valide 🎜🎜4. Organisez horizontalement, mais tous les éléments auront un espace de 1 espace par défaut. comme il y a un écart entre les éléments lors de l'écriture dans le saut de ligne HTML Cart, l'analyse du navigateur l'analysera dans un espace. 🎜🎜🎜🎜 Conversion du type de balise 🎜🎜🎜🎜Le type de balise peut être converti : 🎜🎜🎜🎜Définissez display:inline pour convertir en éléments en ligne 🎜🎜🎜🎜Définissez display:linline - block Convertir en élément de bloc en ligne 🎜🎜🎜🎜 Définissez display:block pour convertir en élément de niveau bloc 🎜🎜🎜🎜 (Partage vidéo d'apprentissage : 🎜tutoriel vidéo HTML🎜, 🎜front web -fin🎜 )🎜

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