[CSS] 列印表格的背景顏色 for Chrome
2017-06-26
最近客戶要印表格出來，大概在螢幕上看起來像是長得這樣子：
但是在列印的時候怎麼設定都長這樣
重點是上面tr的部分，都會消失背景顏色，網路上看了一下，筆記一下，免得之後忘記
在@media print 中指定 tr中會有一個叫做printgray的css style
<style> @media print { tr.printgray { background-color: #DDDDDD !important; -webkit-print-color-adjust: exact; } } </style>
之後，接下來是html 結構部分:
<table style="width: 100%"> <tr style="background-color: gray" class="printgray"> <th>Firstname</th> <th>Lastname</th> <th>Age</th> </tr> <tr> <td>Jill</td> <td>Smith</td> <td>50</td> </tr> <tr> <td>Eve</td> <td>Jackson</td> <td>94</td> </tr> </table>