打印html表

dam*_*mes 2 html css

我有下表,例如,如何向表中添加打印功能?点击一个按钮,通过打印机打印下表

<table border="1">
<tr>
<th>Header 1</th>
<th>Header 2</th>
</tr>
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>
Run Code Online (Sandbox Code Playgroud)

Zah*_*med 5

您需要创建新样式表print.css并设置CSS media = print

例如 :

<style media="screen">
  .noPrint{ display: block; }
  .yesPrint{ display: block !important; }
</style>

<style media="print">
  .noPrint{ display: none; }
  .yesPrint{ display: block !important; }
</style>
Run Code Online (Sandbox Code Playgroud)

并将类添加到"yesPrint"到您要打印的部分

<div class= "yesPrint">
 <table border="1">
 <tr>
 <th>Header 1</th>
 <th>Header 2</th>
 </tr>
 <tr>
 <td>row 1, cell 1</td>
 <td>row 1, cell 2</td>
 </tr>
 <tr>
 <td>row 2, cell 1</td>
 <td>row 2, cell 2</td>
 </tr>
 </table>
 </div>
Run Code Online (Sandbox Code Playgroud)

现在添加一个按钮

<input TYPE="button" onClick="window.print()">
Run Code Online (Sandbox Code Playgroud)

更多详情:http://www.codeproject.com/KB/HTML/Printing_with_CSS.aspx