[英]HTML Draw table with borders only for <tbody> and <tr>
I have an HTML table which looks like: 我有一个HTML表格,看起来像:
<table >
<thead >
<tr><th align="center" colspan="7" style="font-weight: bold; text-decoration: underline;">TEMP</th></tr>
<tr><th align="right" colspan="7">In Lieu of XXXX(P)-28(L)</th></tr>
<tr><th align="center" colspan="7">RECIEPT - HQ XYZ</th></tr>
<tr>
<th align="left" colspan="6">To : 93 SDO</th>
<th align="left" colspan="5">Date : ________<?php ?></th>
</tr>
<tr>
<th align="left" colspan="6">From : 993 FPO</th>
<th align="left" colspan="5">Sheet No:________</th>
</tr>
</thead>
<tfoot>
<tr><td align="center" colspan="7" style="font-weight: bold; text-decoration: underline;">TEMP</td></tr>
</tfoot>
<tbody border="2" cellpadding="2" >
<tr>
<th>First Name</th>
<th>Last Name</th>
<th>Points</th>
<th>First Name</th>
<th>Last Name</th>
<th>Points</th>
<th>First Name</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
<td>Smith</td>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
<td>Smith</td>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
<td>Smith</td>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
<td>Smith</td>
</tr>
</tbody>
</table>
The CSS for the table is like this 表格的CSS是这样的
<style>
table {
page-break-inside:auto;
border= 0px;
}
tr { page-break-inside:avoid;
page-break-after:auto
border=1px solid black;
}
thead { display:table-header-group;
border=1px solid black;
}
tfoot { display:table-footer-group;
border= 0px;
}
</style>
I am trying to achieve borders only for <tbody>
and <tr>
but it's not happening. 我正在尝试仅为<tbody>
和<tr>
实现边界,但是这没有发生。 I have tried making border
property for the table, thead
and foot
as 0px
and collapsed
. 我尝试将表格的border
属性thead
和foot
为0px
并collapsed
。 But I am unable to achieve. 但是我无法实现。 Is it not possible to declare the border properties for individual tags such as tbody, tr, thead, tfoot etc. 是否无法声明单个标签的边框属性,例如tbody,tr,thead,tfoot等。
try border : none;
试试border : none;
instead of border : 0px;
而不是border : 0px;
Add this to your CSS definition: 将此添加到您的CSS定义中:
th {
border: 2px solid #ff0000;
}
(of course, later you adjust size and color) (当然,稍后您可以调整大小和颜色)
BUT, all those td
s after the first row of tbody
must be converted do th
to display the border around them. 但所有这些td
S的第一行后tbody
必须转换做th
,以显示他们周围的边框。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.