首页 > 代码库 > html5之表格元素

html5之表格元素

2024-11-05 22:45:02   209人阅读

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>表格元素</title>
 6 </head>
 7 <body>
 8 <h4>设置表格背景色为黑色，单元格间距为1px<br/>通过设置背景色为黑色可以实现边框效果</h4>
 9 <table style="background-color: #cccccc;border-collapse: separate;border-spacing: 1px;text-align: center" >
10     <caption><b>疯狂java体系图书</b></caption>
11     <!--定义所有列的背景色都是白色-->
12     <colgroup style="background-color: white">
13         <!--设置第一列宽160px-->
14         <col style="width: 160px"/>
15         <!--定义横跨两列，设置这两列各宽100px-->
16         <col span="2" style="width:100px"/>
17     </colgroup>
18     <thead>
19     <tr>
20         <th>书名</th>
21         <th>作者</th>
22         <th>价格</th>
23     </tr>
24     </thead>
25     <tfoot>
26     <tr>
27         <td colspan="3" style="text-align: right">现总计：2本图书</td>
28     </tr>
29     </tfoot>
30     <tbody>
31     <tr>
32         <td>疯狂java讲义</td>
33         <td>李刚</td>
34         <td>109</td>
35     </tr>
36     <tr>
37         <td>轻量级Java EE企业应用实战</td>
38         <td>李刚</td>
39         <td>89</td>
40     </tr>
41     </tbody>
42 </table>
43 </body>
44 </html>

 

<colgroup>组织多个<col/>元素，指定属性对它包含的所有<col/>元素有效，可指定id,style,class等通用属性

<col/>用于制定表格一列或者多列的整体属性，span属性指定受影响列数，可指定id,style,class等通用属性

设置表格背景色为黑色，单元格间距为1px
通过设置背景色为黑色可以实现边框效果

疯狂java体系图书
书名作者价格
现总计：2本图书
疯狂java讲义 李刚 109
轻量级Java EE企业应用实战 李刚 89

html5之表格元素


联系
我们