2010-10-21 2 views
1

У меня возникли проблемы с созданием сайта, идентичным просмотру его в браузере, для печати. Это выглядит хорошо, единственное, что заставило меня застрять в том, что оно отказывается отображать фоны. Изображения прекрасны, хотя это просто фоны. Я не пытался установить изображение в качестве фона, но это не должно быть так или иначе, не так ли?HTML/CSS - Стиль для печати, фон не отображается?

Я применяю фон к элементу DIV с шестнадцатеричными цветами, если это имеет значение.

Есть ли способ обойти это? Я искал его, но я не обнаружил, что у кого-то была такая же проблема.

Спасибо!

+1

Некоторые браузеры могут игнорировать фон при печати, чтобы сохранить чернила. – You

ответ

3

Фоновые изображения, которые печатаются или нет, не могут заставить вас использовать CSS: это настройка браузера, а большинство (если не все) браузеров по умолчанию - «», а не «».

+0

Хм, хорошо. Есть ли обходной путь? Я не установил изображение в качестве фона, я просто установил сплошной цвет, но я не думаю, что это важно. – Nike

+0

Я думаю, что нет (если вы не попросите своих посетителей изменить настройки браузера). Как правило, для декоративных элементов и т. Д. если ваш фон содержит информативный контент, вы можете сделать его образ (я имею в виду элемент IMG) - это будет напечатано - и при необходимости скрыть текстовое содержимое одним из многих методов замены изображений. – djn

1

Вы можете попробовать использовать два отдельных элемента, например абзац и изображение, а затем установить z-индекс изображения ниже, чем z-индекс абзаца, а затем полностью позиционировать изображение за вашим контентом. Но я бы рекомендовал не иметь фоновой печати. В противном случае вы будете возиться с ожиданиями пользователей, и люди, вероятно, будут раздражаться.

+0

Я мог бы это сделать. Я не устанавливаю фон для всей страницы, я просто устанавливаю его для заголовка таблицы. Я не думаю, что они будут раздражаться этим. :) – Nike

+0

Хороший звонок. На самом деле, имеет смысл отображать фон на заголовке таблицы ... хм ... Мне нужно провести мозговой штурм и посмотреть, могу ли я придумать более эффективный способ сделать это. Еще одна мысль: вы можете использовать изображение в заголовке таблицы, которое содержит текст, который вы хотите, а также фон. Просто убедитесь, что вы используете правильный текст alt, если используете этот подход. –

+0

Хорошая вещь с большим количеством браузеров заключается в том, что если у вас есть белый текст на черном фоне, браузер будет менять цвет текста на черный, когда вы печатаете без фона. –

5

По умолчанию многие браузеры не печатают фоновые изображения и цвета. Вам нужно включить это в параметрах печати. Chrome не имеет такой вариант, но чтобы сделать WebKit браузеры (Safari, Google Chrome) печатать фоновое изображение или цвет, который вы должны добавить следующий стиль CSS к элементу:

-webkit-print-color-adjust: exact; 
+0

Это отлично работает для нашего внутреннего списка браузеров. С уважением. – RSG

1

CSS: box-shadow: inset 0 0 0 1000px gold;

Works для всех браузеров, а также для ячеек и строк таблицы.

+0

Что это касается связанного с этим вопроса? Они спрашивали о том, что фоновые изображения не печатаются. Как box-shadow относится к этому * каким-либо образом *? –

+0

@ Андрей, этот трюк просто идеален: тень коробки становится фоном, а затем печатается! – Guillaume

+0

Хммм, @Guillaume; Я вижу это сейчас. Дополнительное объяснение, отредактированное, также помогает. Спасибо, что исправил меня! –

Смежные вопросы