Qu'est-ce qu'un tableau HTML ? Comment utiliser divers attributs dans la balise

寻∝梦

Libérer： 2018-08-22 13:59:09

original

24641 Les gens l'ont consulté

Tout d'abord, comprenons ce qu'est une table et sa fonction

Qu'est-ce que un tableau Tableau : Un

tableau composé d'un certain nombre de cases rectangulaires appelées cellules disposées ensemble dans l'ordre de gauche à droite, de haut en bas. Le rôle d'un tableau : afficher des informations dans une certaine structure.

Comment nous utilisons le tableau :

Définir le tableau :

Créer une ligne de tableau : ;/tr>

Créer des colonnes (cellules) :

Remarque : Par défaut, les colonnes de chaque ligne sont unifiées.

table : display:table;

Caractéristiques de la table html :

1. 🎜>2. Largeur adaptative (déterminée par le contenu)

Attributs du tableau html :

1.width : Définir la largeur du tableau

2.height : Définir la hauteur du tableau

3.align : Définir la hauteur de le tableau dans son élément parent Alignement horizontal, valeur : gauche, centre, droite

4.border : bordure, largeur de bordure, valeur en px, px peut être omis

5.cellpadding

                                                  utiliser les «        » La distance entre les cellules ou entre les cellules et la table <.>

2. Attribut dans le tableau

3.bgcolor

3. L'attribut

• valign

• bgcolor

• colspan : définir les cellules pour qu'elles s'étendent sur les colonnes

• rowspan : Définissez les cellules pour qu'elles s'étendent sur les lignes
Aussi d'autres balises dans le tableau :
1,
Fonction : Définir le titre du tableau

Titre de colonne : Chaque colonne de chaque ligne, en gras, horizontal L'effet de centrage affiche

Titre de ligne : la première colonne de chaque ligne, en gras, le centrage horizontal l'effet affiche

Titre de la ligne (colonne) :

<table>
    <caption>标题</caption>
    <tr>
        <td></td>
        <td></td>
    </tr>
</table>

3. Applications complexes des tableaux

Le tableau peut être divisé en 3 parties

2. Corps du tableau< tbody>

Remarque : si les lignes du tableau ne sont pas regroupées, elles sont toutes par défaut appartiennent au corps

Le nombre de colonnes dans chaque ligne n'est pas unifié.

1. Traverser les colonnes

<table>
    <tbody>
         <tr></tr>
         <tr></tr>
    </tbody>
</table>

2. Traverser les lignes

3 Imbrication des tableaux

Tableau HTML style unique Attributs

<table>
    <tr>
       <td>
<table>
    <tr>
        <td>
        </td>
    </tr>
</table>
       </td>
    </tr>
</table>

Valeur : 1.separate : valeur par défaut, bordure séparée mode

2. Marge de bordure de l'attribut de style de table html

Valeur :

1. Prenez 1 valeur

ce qui signifie que l'espacement horizontal et vertical sont égaux

2. Prenez 2 valeurs

. Premier L'espacement horizontal représenté par la première valeur

L'espacement vertical représenté par la deuxième valeur

Séparé par un espace

3 Exigences

bordure-. le repli doit être séparé

Il doit être valide en mode bordure séparée

3. Position du titre de l'attribut de style de table html

Fonction : Changer la position du titre de la position par défaut en dessous du tableau

Attribut : côté légende

Valeur :

1. en haut : Par défaut

2. En bas : Le titre est sous le tableau

4. Règles d'affichage pour les attributs de style de tableau du tableau html

1.Fonction

Spécifiez comment le navigateur présente un tableau. Il précise en fait les règles d'algorithme de la cellule

Algorithme par défaut : la largeur de la cellule est déterminée par le contenu et n'est pas limitée par la valeur de largeur définie.

2. Attribut : table-layout

Valeur :

1 auto : valeur par défaut, automatique, la largeur de la colonne est déterminée par le contenu

2. fixe : disposition du tableau fixe, la largeur des colonnes est déterminée par la valeur définie.

3. Disposition automatique du tableau & disposition du tableau fixe

1. Disposition automatique du tableau (auto)

La taille de la cellule s'adaptera à la taille du contenu

Dans Lorsque le tableau est complexe, le chargement sera plus lent

Convient pour une utilisation lorsque la taille de chaque colonne est incertaine

Méthode de présentation de tableau traditionnelle

2. Tableau fixe mise en page (fixe)

La taille de la cellule est déterminée par la valeur définie et n'a rien à voir avec le contenu

Cela accélérera l'affichage du tableau, et le navigateur ne le fera pas besoin de le calculer après avoir chargé la première ligne.

4. Effet d'affichage caché

Attribut : visibilité:collapse

est utilisé sur les éléments du tableau pour supprimer une ligne ou une colonne sans affecter toute la disposition du tableau

Merci d'avoir lu cet article. Si vous avez des questions ou des questions à ce sujet, vous pouvez les poser ci-dessous.

Il y a un autre article sur cette version avancée, bienvenue à cliquer : Introduction au style de balise de table html5 (avec un exemple de centrage CSS de table html5)

[ Petits articles connexes édités par l'éditeur]

Quelle est la fonction de la balise html em ? La différence entre les balises et