30 юни, 2011

CSS проблем: печат на бял текст, който е върху черна картинка

Имате сайт с прекрасен дизайн, който е изпълнен изрядно в XHTML/CSS. За злощастие на разработчика, в този сайт има елемнт с черен фон, който е картинка (и няма вариант да не е картинка), върху който трябва да има текст с бял цвят. Дотук всичко е добре. Но само за @media = screen. Когато опрем до @media = print нещата придобиват по-грозен оттенък.

И, след няколкочасово проучване, стигате до единственото възможно решение - текста трябва също да е картинка с alt-текст (или по-непрепоръчвания вариант с text-indent), в противен случай... не може да гарантирате нищо на дизайнера. Лоша работа.

I don't think you'll be able to solve this problem easily. By default, browsers do not print backgrounds on web pages. That means that if you have dark backgrounds and light text, it is left to the discretion of the browser to print something readable to you. Some browsers just go with the normal black on white, others try to match the shade of the text colour but they all render text so that it will be seen.

Since browser doesn't know that you have an elaborate plan on how to trick it to print white text on dark image it just does what it does. If you want to print white text on dark, you need to turn on background printing. And I guess tell your users to do the same. In IE you might be able to force it upon them via scripting, but if it is not an intranet application I would just rather give directions how to turn on background printing manually.

Няма коментари: