CSS Как напечатать таблицу с цветом фона (без изменения настроек печати) - PullRequest
Новая
       1

CSS Как напечатать таблицу с цветом фона (без изменения настроек печати)

37 голосов
/ 25 февраля 2011

Целью является печать таблицы с цветными тд-с.Мне нужен правильный путь для всех типов браузеров.

Есть ли способ?

Ответы [ 13 ]

0 голосов
/ 07 января 2019

Для хрома вы можете использовать это: 

-webkit-print-color-adjust:exact;

Или в окне предварительного просмотра установите флажок Дополнительные настройки-> Фоновая графика

image

Для Firefox вы не можете включить его, используя любой CSS. Вы можете включить его следующим образом (если вы не видите файл, нажмите клавишу Alt один раз). Файл-> Настройка страницы и отметьте Печать фона (цвет и изображения) image

0 голосов
/ 06 апреля 2018

Это глупое решение сработало для меня в Firefox и Chrome (Ubuntu).

Firefox: Откройте диалоговое окно печати (ярлык: Ctrl + P ) и перейдите на вкладку Options, и убедитесь, что опция Print Background Colors отмечена.

Firefox's Print Settings

Chrome: Откройте диалоговое окно печати (ярлык: Ctrl + P ), разверните More settings и отметьте Background graphics.

Chrome's Print Settings

Насколько я тестировал, -webkit-print-color-adjust:exact; не работает для Firefox и имеет честь в Chrome. Но в обоих браузерах последний вариант печати переопределяет все это. Так что вы можете полностью обойтись без него.

Попробуйте напечатать следующий пример HTML-страницы с различными настройками, описанными здесь, и без них, и вы узнаете. 

<!DOCTYPE html>
<html>

<head>
  <style>
    body {
      -webkit-print-color-adjust: exact;
    }
  </style>
</head>

<body>
  <table style="border-width:1px;width:50%;">
    <tr style="background-color:#999999">
      <td>First Row</td>
    </tr>
    <tr style="background-color:#CCCCCC">
      <td>Second Row</td>
    </tr>
  </table>

</body>

</html>
0 голосов
/ 04 апреля 2012 
            <td><img src="your_image" /></td>
Страница:
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

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

...