欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识！
您现在的位置是： 首页

task1表格

程序员文章站 2022-03-16 09:00:37
...

task1表格

    

    2. 

  2. <!DOCTYPE html>
    3. 

  3. <html lang="zh-CN">
    4. 

  4. <head>
    5. 

  5.     <meta charset="UTF-8">
    6. 

  6.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
    7. 

  7.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
    8. 

  8.     <title>12月22日作业 task1表格</title>
    9. 

  9. </head>
    10. 

  10. <body>
    11. 

    12. 

  12. <table class="" border="1" width="500">
    13. 

    14. 

  14.     <caption>表格标题是caption </caption>
    15. 

  15. <thead>
    16. 

  16.  <tr>
    17. 

  17.         <th>表头</th>
    18. 

  18.         <th>文件</th>
    19. 

  19.         <th>是</th>
    20. 

  20.         <th>thead</th>
    21. 

  21.     </tr>
    22. 

  22. </thead>
    23. 

    24. 

  24. <tbody>
    25. 

  25. <tr>
    26. 

  26.     <td>我是</td>
    27. 

  27.     <td>第一行</td>
    28. 

  28.     <td>的</td>
    29. 

  29.     <td>内容</td>
    30. 

  30. </tr>
    31. 

  31. <tr>
    32. 

  32.     <td class=hbl rowspan="3" >如果合并列用
    33. 

  33.         <p>rowspan="列数"</p></td>
    34. 

  34.     <td>PHP</td>
    35. 

  35.     <td>中文网</td>
    36. 

  36.     <td>I LOVE YOU</td>
    37. 

  37. </tr>
    38. 

  38. <tr>
    39. 

  39.     <td>我的</td>
    40. 

  40.     <td>学号</td>
    41. 

  41.     <td>296113</td>
    42. 

  42.     <!-- <td>您好</td> -->
    43. 

  43. </tr>
    44. 

  44. <tr>
    45. 

  45.     <td>这是</td>
    46. 

  46.     <td>我的</td>
    47. 

  47.     <td>表格作业</td>
    48. 

  48.     <!-- <td>您好</td> -->
    49. 

  49. </tr>
    50. 

  50. <tr>
    51. 

  51.     <td class=hbh colspan="4">合并行用colspan="行数"
    52. 

  52.         <p>并注释后面行数</p>
    53. 

  53.     </td>
    54. 

  54.     <!-- <td>我</td>
    55. 

  55.     <td>是超出的部分被</td>
    56. 

  56.     <td>注释</td> -->
    57. 

    58. 

  58. </tr>
    59. 

  59. </tbody>
    60. 

    61. 

  61. <tfoot border="1" class="tfoot">
    62. 

  62.     <tr>
    63. 

  63.         <td colspan="4" >表格的底部是
    64. 

  64.             <p>用tfoot标签</p>
    65. 

  65.         </td>
    66. 

  66.         <!-- <td></td>
    67. 

  67.         <td></td>
    68. 

  68.         <td></td> -->
    69. 

  69.     </tr>
    70. 

  70. </tfoot>
    71. 

    72. 

  72. </table>
    73. 

    74. 

  74. <style>
    75. 

  75.      table {  
    76. 

  76.         width: 900px;
    77. 

  77.         text-align: center;
    78. 

  78.         background-color: cadetblue;
    79. 

  79.     }
    80. 

  80.     .hbl{
    81. 

  81.         background-color: aqua;
    82. 

  82.     }
    83. 

  83.     .hbh{
    84. 

  84.         background-color: azure;
    85. 

  85.     }
    86. 

    87. 

  87. </style>
    88. 

  88. </body>
    89. 

  89. </html>
    90.

上一篇： 关于php公历农历的互相转换，你可能会需要！

下一篇： springboot controller接收参数

推荐阅读