Maison >interface Web >tutoriel HTML >Une brève discussion sur l'application du balisage structuré des tableaux de pages Web HTML

Une brève discussion sur l'application du balisage structuré des tableaux de pages Web HTML

高洛峰
高洛峰original
2017-02-10 10:26:461481parcourir

L'éditeur suivant vous proposera une brève discussion sur l'application du balisage structuré des tableaux de pages Web HTML. L'éditeur le trouve plutôt bon, je vais donc le partager avec vous maintenant et le donner comme référence pour tout le monde. Suivons l'éditeur et jetons un coup d'œil

Avant de parler du balisage structuré des tableaux Web, jetons un œil à quelques images.

Une brève discussion sur lapplication du balisage structuré des tableaux de pages Web HTML

Structure du tableau HTML

La soi-disant structuration, comme le montre la première image ci-dessus Afficher signifie diviser notre tableau en trois types : en-tête, corps et pied de page. Par conséquent, lorsque nous modifions la partie du corps de la table, cela n’affectera pas les deux autres parties, découplant ainsi et facilitant notre application.

Format structuré


Code XML/HTMLCopier le contenu dans le presse-papier

  1. table> 

  2.  

  3. tête>< ;/ tête> -------- Zone d'en-tête

  4. tbody>tbody> ---------Zone du corps

  5. pied >tfoot>------------ table Zone de queue

  6. Résumé : En divisant le tableau en trois parties, il nous est pratique de modifier le tableau.

  7. Titre du tableau Html

Chaque tableau a son propre titre, comme le montre la deuxième image ci-dessus, alors comment faire pour que le titre suive le contenu Venez bouger ?

Titre du tableau

Code XML/HTML


Copier le contenu dans le presse-papier


table>

 

  1.  

    légende

  2. >
  3. légende
  4. > Les valeurs d'attribut sous le tableau> 

  5. sont :
  6. Nom de l'attribut

  7. Valeur de l'attribut
  8. DescriptionalignerHautLe titre est au dessus du tableau

  9. Bas

Le titre est en dessous du tableau

Résumé :

En définissant le titre du tableau, vous pouvez faire bouger le titre avec le tableau à tout moment.

Format HTML en ligne

Quel est le format en ligne du tableau ? Ce que nous voyons habituellement dans Excel, c'est l'ajout d'une couleur d'arrière-plan à toute la colonne.

Nom de l'attribut


Valeur de l'attribut

DescriptionAlignerGauche

GaucheCentre

Accepté

Droite

Garder la droite

Valign

Droite

Garder la droite

Haut

Accepté

Milieu

Milieu

Bas

Down

Span

Numéro

Numéro de série

Résumé :

En définissant le format en ligne du tableau, nous pouvons approfondir la couleur du contenu dont nous avons besoin. Ceci concerne uniquement le contenu des colonnes.

Le code source est le suivant :

Code XML/HTML

Copiez le contenu dans le presse-papiers


  1. html>                       🎜>

    tête
  2. >

      

  3. li
  4. >

    L'utilisation de tableaux li> 

  5. table
  6. largeur

    ="500" >

    tr
  7. >

    🎜>td aligner

    =
  8. "centre"
  9. >Feuille de notation de l'élèvetd> > ;td

  10. >
  11. 🎜>

    tableau bordure=

    "1"
  12. largeur

    ="100 %">                                                                 >

  13. tr&g t;                       th> Nomth> 

  14. th>Chinois

  15. th

    > th>

    Mathématiques
  16. th>ième>

    langue étrangère
  17. ième> >>tête

  18. > ;
  19. >

    tbody> tr> 

  20. td> Zhang Santd>

    >
  21. 95
  22. td> >td

  23. >
  24. 95

    td> 

  25. td>95

  26. td
  27. > 

  28. tr
  29. > 

  30. tr>     

  31. td>张三td>     

  32. td>95td>      

  33. td>95td>     

  34. td>95td>     

  35. tr>     

  36. tr>     

  37. td>张三td >     

  38. td>95 td>     

  39. td> 95td>     

  40. td>95td>     

  41. tr>     

  42. tbody>     

  43. tfoot>     

  44. tr>    

  45. td colspan="4">成绩汇总td >     

  46. tr>     

  47. pied>     

  48. table>     

  49. td>     

  50. tr>     

  51. table>     

  52.      

  53. br/>     

  54.      

  55. li>表格嵌套的使用二li>     

  56.      

  57. table bordure="1" largeur="500" >     

  58. légende aligner="bas">Étudiant Scorelégende> 🎜>

    >
  59. tr

    >
  60. >
  61. th> Nom

  62. ème

    > ème> th

  63. >
  64. Mathématiques

    th> 🎜>>Langue étrangèreth>

  65. tr

    >  tête>

  66. tbody> >tr>

     
  67. td>

    Zhang San
  68. td> 

  69. td>95td

    >
  70.  

    td

  71. >
  72. 95

    td                                                                   td>

  73. tr> ;tr>

    >
  74. td>Zhang San td>

    td>95td>                                                                      ;/td

  75. td

    >
  76. 95
  77. td > >tr

    >
  78.  
  79. tr>

  80. td

    >Zhang Santd> 

  81. td>95td>     

  82. td>95td>     

  83. td>95td>     

  84. tr>     

  85. tbody>     

  86. tfoot>     

  87. < ;tr>     

  88. td colspan ="4">成绩汇总td>     

  89. tr>     

  90. pied>     

  91. table >     

  92.         

  93. br/>      

  94.      

  95. li>表格嵌套的使用三li>    

  96. tableau bordure="1" largeur="500" >     

  97. légende aligner="bas">学生成绩légende>     

  98. col >col>     

  99. col bgcolor=bleu>col>     

  100. tête>     

  101. tr>     

  102. th>姓名th>     

  103. th>语文th>

  104. th>数学th>     

  105. th>外语th>     

  106. tr>     

  107. tête>     

  108. tbody>     

  109. tr >     

  110. td>张三td>     

  111. td>95< ;/td>     

  112. td >95td>     

  113. td>95td>     

  114. tr>     

  115. tr >     

  116. td>张三td>     

  117. td>95td>     

  118. td>95td>     

  119. td>95td>     

  120. tr>     

  121. tr>     

  122. td >张三td>     

  123. < ;td>95td>     

  124. td>95td> ;     

  125. td>95td>     

  126. tr>

  127. tbody>     

  128. tfoot>     

  129. tfoot>     

  130. table>     

  131.  

  132. corps> 

  133. tête> 🎜>

    html
  134. >

                                        C'est tout sur l'application des balises structurées. J'espère que cela sera utile à tout le monde. Veuillez soutenir le site Web PHP chinois ~Pour plus d'articles sur l'application des balises structurées dans les tableaux des pages Web HTML, veuillez prêter attention au Site Web chinois PHP !

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