Не показывает before/after элементы при печати
Почему не показывает before/after элементы(графики) когда делается печать? Есть какое то решения ? весь контент отображается при печати, но все что находится в before\after не отображается.
function printdiv() {
let printResume = pupMenu.children[0].innerHTML;
document.body.innerHTML = printResume;
window.print();
location.reload()
}
Ответы (2 шт):
Потому что у вас в CSS в @media print { /*...*/ } ничего не добавлено. Вот и подгружается дефолтная CSS. Плюс включите галочку Печать фона в диалоге настройки печати.
let printResume = pupMenu.children[0].innerHTML; document.body.innerHTML = printResume;
Эта попытка сэкономить на написании стилей для печати весьма неудачна.
Заменяя всё body на некоторый элемент, ты вынимаешь его из иерархии, соответственно все стили, унаследованные от родительских элементов кроме body, гарантированно исчезают. Одновременно с этим перестают работать все css-селекторы, которые знают о размещении этого элемента внутри других. А ещё таким кодом можно даже поломать разметку.
Вот тут есть инструкция по отладке стилей но в твоём случае её стоит применять после выполнения процитированного куска кода.
Впрочем, лучше снести этот код, и заменить на добавление специального класса единственному div'у и написанные для @media print стили, которые будут отображать страницу в таком виде, что виден будет только элемент с соответствующим классом и он будет занимать всю страницу. Это надо писать под конкретные стили и конкретную разметку.