Настройка window.print () - PullRequest
Новая
       1

Настройка window.print ()

0 голосов
/ 02 ноября 2018

Я использовал функцию window.print () для печати веб-страницы с таблицей. Заголовок таблицы имеет цвет шрифта. Проблема в том, что при печати заголовки просто черные. Ниже приведен код: 

<thead>
<tr style="color:red">
<th>Property name</th>
<th>Room number</th>
<th>Month</th>
<th>Tenant name</th>
<th>Rent Required</th>
<th>Rent Paid</th>
<th>Balance</th>

</tr>
</thead>

// кнопка 

<input type="button" class="btn btn-block 
btn-primary  btn-xs" value="PRINT" 
onclick="window.print() ;" />

Есть ли способ заставить его напечатать строку таблицы красным цветом?

1 Ответ

0 голосов
/ 02 ноября 2018

Для Chrome / Safari (не уверен в Firefox) вы можете использовать следующий CSS, чтобы сохранить цвета при отображении и печати:

-webkit-print-color-adjust: exact;

Полный рабочий пример ниже. 

<head>
  <style>
    .font-red {
      -webkit-print-color-adjust: exact;
      color: red;
    }
  </style>
</head>
<body>
  <table>
    <thead>
      <tr class="font-red">
        <th>Property name</th>
        <th>Room number</th>
        <th>Month</th>
        <th>Tenant name</th>
        <th>Rent Required</th>
        <th>Rent Paid</th>
        <th>Balance</th>
      </tr>
    </thead>
  </table>

  <input type="button" class="btn btn-block btn-primary  btn-xs" value="PRINT" onclick="window.print() ;" />
</body>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...