Как распечатать встроенные стили CSS? - PullRequest
Новая
       7

Как распечатать встроенные стили CSS?

9 голосов
/ 12 августа 2011

есть ли способ печати стилей CSS, которые встроены?

Я использую этот код для печати части кода: 

w=window.open();
w.document.write($('#printable').html());
w.print();
w.close();

Я мог бы использовать внешний файл и сделать его media = print, но часть HTML - это символы, которые генерируются php, и я мог бы сделать это, создав класс для каждого возможного результата, но это было бы больно.

Есть идеи? Спасибо.

Ответы [ 2 ]

12 голосов
/ 12 августа 2011

См. Демонстрацию: http://jsfiddle.net/rathoreahsan/x69UY/

Что вы думаете, если делаете так: 

<div id="printableDiv">
    <style type="text/css">
        @media print {
            #printable { 
               color: red; 
               // Any Other style you want to add 
             }
        }
    </style>
    <div id="printable">
        This Text will print in red color.
    </div>
</div>

Javascript / jQuery код: 

w=window.open();
w.document.write($('#printableDiv').html());
w.print();
w.close();

ВВ этом сценарии, когда всплывающее окно открывается и получает HTML-код printableDiv, стили для принтера будут включены в это всплывающее окно, чтобы принтер считывал стили из всплывающего окна и печатал таким образом.

0 голосов
/ 03 мая 2015

У меня была такая же проблема, потому что я использую стиль стиля для динамического изменения цвета фона, и тогда цвет не был в отпечатке.styleSheets [3] - это мой файл print.css.

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

<script type='text/javascript'>
  document.styleSheets[3].insertRule(" #caldiv_<?smarty $item.calendar_id ?> { border-color:<?smarty $item.color ?> }", 1);
</script>
...