比较完整的CSS定义表格样式

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">   
  2. <html xmlns="http://www.w3.org/1999/xhtml">   
  3. <head>   
  4. <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />   
  5. <title>Table Style</title>   
  6. <style>   
  7. #browser{   
  8. width:700px;   
  9. margin:0 auto;   
  10. border-collapse:collapse;   
  11. font-family:ArialHelveticasans-serif;   
  12. text-align:center;   
  13. }   
  14. #browser th,td{   
  15. border:1px solid #aaa;   
  16. }   
  17. #browser thead th{   
  18. border-bottom:2px solid #3d580b;   
  19. background-color:#8fc629;   
  20. color:#fff;   
  21. padding:10px 0px;   
  22. }   
  23. #browser th{   
  24. background-color:#f2f4b9;   
  25. }   
  26. #browser th.title{   
  27. background-color:#e3e685;   
  28. }   
  29. #browser tfoot td{   
  30. border-width:0px;   
  31. text-align:rightright;   
  32. font-size:12px;   
  33. color:#777;   
  34. }   
  35. #browsecaption{   
  36. font-weight:bold;   
  37. padding:6px 0px;   
  38. color:#3d580b;   
  39. font-size:25px;   
  40. }   
  41. #xhtml th.title{   
  42. background-color:#ffd56c;   
  43. }   
  44. #xhtml th{   
  45. background-color:#ffe8ae;   
  46. }   
  47. </style>   
  48. </head>   
  49. <body>   
  50. <h1>Table Style</h1>   
  51. <hr />   
  52. <table id="browser">   
  53. <caption>浏览器兼容性一览表</caption>   
  54. <thead>   
  55. <tr>   
  56. <th>CSS特征</th>   
  57. <th>MSIE 6.0 </th>   
  58. <th>FF 1.0 </th>   
  59. <th>FF 1.5 </th>   
  60. <th>OP 8.5 </th>   
  61. </tr>   
  62. </thead>   
  63. <tbody id="html">   
  64. <tr>   
  65. <th colspan="5" class="title">HTML 4.01</th>   
  66. </tr>   
  67. <tr>   
  68. <th>a</th>   
  69. <td>81%</td>   
  70. <td>85%</td>   
  71. <td>85%</td>   
  72. <td>94%</td>   
  73. </tr>   
  74. <tr>   
  75. <th>abbr</th>   
  76. <td>N</td>   
  77. <td>97%</td>   
  78. <td>85%</td>   
  79. <td>94%</td>   
  80. </tr>   
  81. <tr>   
  82. <th>acronym</th>   
  83. <td>94%</td>   
  84. <td>97%</td>   
  85. <td>97%</td>   
  86. <td>75%</td>   
  87. </tr>   
  88. </tbody>   
  89. <tbody id="xhtml">   
  90. <tr>   
  91. <th colspan="5" class="title">XHTML 1.0 changes</td>   
  92. </tr>   
  93. <tr>   
  94. <th>HTML in XML </th>   
  95. <td>N</td>   
  96. <td>Y</td>   
  97. <td>Y</td>   
  98. <td>Y</td>   
  99. </tr>   
  100. <tr>   
  101. <th>well-formed</th>   
  102. <td>Y</td>   
  103. <td>Y</td>   
  104. <td>Y</td>   
  105. <td>Y</td>   
  106. </tr>   
  107. <tr>   
  108. <th>Media Types </th>   
  109. <td>N</td>   
  110. <td>Y</td>   
  111. <td>Y</td>   
  112. <td>Y</td>   
  113. </tr>   
  114. </tbody>   
  115. <tfoot>   
  116. <tr>   
  117. <td colspan="5">资料来源 HTTP://Rlog.Cn</td>   
  118. </tr>   
  119. </tfoot>   
  120. </table>   
  121. </body>   
  122. </html>   
posted @ 2008-03-27 15:48  cm186man  阅读(1814)  评论(0编辑  收藏  举报