zoukankan      html  css  js  c++  java
  • 表格

    1. <!DOCTYPE html>
    2. <html>
    3. <head>
    4. <metacharset="UTF-8">
    5. <title></title>
    6. <style>
    7. table{
    8. border-collapse: collapse;
    9. }
    10. th,td{
    11. padding:0;
    12. }
    13. table{
    14. margin:0auto;
    15. width:500px;
    16. }
    17. th,td{
    18. border:1px solid pink;
    19. font:20px/50px"微软雅黑";
    20. text-align: center;
    21. }
    22. </style>
    23. </head>
    24. <body>
    25. <!--
    26. 表格标签
    27. table 表格
    28. thead 表格头
    29. tbody 表格主体
    30. tr 表格行
    31. th 表格头里的单元格(默认加粗并且居中)
    32. td 表格主体里的单元格
    33. tfoot 表格底部
    34. 表格的默认样式
    35. table{border-collapse:collapse;} 单元格之间的间隙
    36. th,td{padding:0}
    37. rowspan 合并行(竖着合并)
    38. colspan 合并列(横着合并)
    39. -->
    40. <tablecellspacing="0">
    41. <thead>
    42. <tr>
    43. <th></th>
    44. <th>星期一</th>
    45. <th>星期二</th>
    46. <th>星期三</th>
    47. <th>星期四</th>
    48. <th>星期五</th>
    49. </tr>
    50. </thead>
    51. <tbody>
    52. <tr>
    53. <tdrowspan="4"> 上午</td><!--这里代表的是并列4行,最终呈竖向-->
    54. <td>语文 </td>
    55. <td>数学</td>
    56. <td>英文</td>
    57. <td>生物</td>
    58. <td>化学</td>
    59. </tr>
    60. <tr>
    61. <td>语文 </td>
    62. <td>数学</td>
    63. <td>英文</td>
    64. <td>生物</td>
    65. <td>化学</td>
    66. </tr>
    67. <tr>
    68. <td>语文 </td>
    69. <td>数学</td>
    70. <td>英文</td>
    71. <td>生物</td>
    72. <td>化学</td>
    73. </tr>
    74. <tr>
    75. <td>语文 </td>
    76. <td>数学</td>
    77. <td>英文</td>
    78. <td>生物</td>
    79. <td>化学</td>
    80. </tr>
    81. <tr>
    82. <tdrowspan="2"> 下午</td>
    83. <td>语文 </td>
    84. <td>数学</td>
    85. <td>英文</td>
    86. <td>生物</td>
    87. <td>化学</td>
    88. </tr>
    89. <tr>
    90. <td>语文 </td>
    91. <td>数学</td>
    92. <td>英文</td>
    93. <td>生物</td>
    94. <td>化学</td>
    95. </tr>
    96. <tr>
    97. <tdcolspan="6">夜自习</td><!--这里表示并列6列,最终呈行显示-->
    98. </tr>
    99. </tbody>
    100. </table>
    101. </body>
    102. </html>
     
  • 相关阅读:
    集合和函数
    列表,元组和字典
    运算符与基本数据类型(int,boolean,str)
    html入门新感悟
    Http协议
    java编程基础(四)函数与数组
    java编程基础(三)流程控制语句
    java编程基础(二)java中的运算符
    用html和css来编辑一个简单的html页面
    Oracle golden gate 技术详解
  • 原文地址:https://www.cnblogs.com/CafeMing/p/6274405.html
Copyright © 2011-2022 走看看