当我打印这个时,在第二页的表格左侧和顶部缺少边框.我怎样才能解决这个问题？
<!DOCTYPE HTML>
<html>
<head>
<Meta charset="UTF-8" />
<style type="text/css">
@media print
{
body {
margin: 0;
padding: 0;
color: #000000 !important;
background-color: #ffffff !important;
}
* {
color: inherit !important;
background-color: transparent !important;
background-image: none !important;
}
table {
width: 100%;
border: 1pt solid #000000;
border-collapse: collapse;
font-size: 11pt;
}
#space { height: 750px; }
}
</style>
</head>
<body>
<br /><br />
<h2>.</h2>
<div id="space"></div>
<table border="1">
<thead>
<tr><th>Amount</th><th>label</th></tr>
</thead>
<tbody>
<tr><td>20</td><td>pineapple</td></tr>
<tr><td>20</td><td>pineapple</td></tr>
<tr><td>20</td><td>pineapple</td></tr>
<tr><td>20</td><td>pineapple</td></tr>
<tr><td>20</td><td>pineapple</td></tr>
<tr><td>20</td><td>pineapple</td></tr>
<tr><td>20</td><td>pineapple</td></tr>
<tr><td>20</td><td>pineapple</td></tr>
<tr><td>20</td><td>pineapple</td></tr>
<tr><td>20</td><td>pineapple</td></tr>
<tr><td>20</td><td>pineapple</td></tr>
<tr><td>20</td><td>pineapple</td></tr>
<tr><td>20</td><td>pineapple</td></tr>
<tr><td>20</td><td>pineapple</td></tr>
</tbody>
</table>
</body>
</html>
解决方法
更改表格样式以使某些内容看起来很好：
table {
border: 1pt solid #000000;
border-collapse: separate;
border-spacing: 0;
font-size: 11pt;
width: 100%;
}
编辑：
要让某些东西看起来很完美,首先,删除所有表格边框然后用你想要的东西定义每个样式,以便只有一条边界线(为th,td,tr创建边框)：
table {
border-collapse: separate;
border : 0px solid #000000;
border-spacing: 0;
font-size: 11pt;
width: 100%;
border-color: #000000 ;
border-right: 1px solid;
}
tr {
border-color: #000000 ;
border-style: none ;
border-width: 0 ;
}
td {
border-color: #000000 ;
border-left: 1px solid;
border-bottom:1px solid ;
}
th {
border-color: #000000 ;
border-left: 1px solid;
border-top:1px solid ;
border-bottom:1px solid ;
}
