Медиа-запросы на печать не работают

Question

Медиа-запросы на печать не работают

0

HTML

<div id="printDiv" style="display:none">
    <p>some content here</p>
</div>

<input type="button" id="btnPrint" value="Print"/>

<div>
    <img src="http://eoimages.gsfc.nasa.gov/images/imagerecords/79000/79831/myanmar_tm5_2004349.jpg" height="10000px"/>
</div>

JQuery

$(function(){
    $("#btnPrint").click(function(){
        window.print();
    });
});

CSS

@media print {
    body * {
       display: none;
    }
    #printDiv, #printDiv * {
       display: block;
    }
    #printDiv {
       position: absolute;
       left: 0;
       top: 0;
    }
}

Демо: http://jsfiddle.net/Nu5SX/7/

Я хочу распечатать div, используя Media Queries. Но он печатает белую страницу. Пожалуйста помоги..

Billy 13 дек. 2013, в 08:23

Источник

Теги:

javascript

jquery

css3

2 ответа

Ещё вопросы

epascarello · Answer 1 · 2013-12-13T05-27-00.000Z

Потому что css специфичность

style="display:none"

переопределяет правило CSS

Установите отображение none в обычный файл CSS, а не в встроенный атрибут.

Ashish Kumar · Answer 2 · 2013-12-13T07-40-00.000Z

попробуй это:

@media print {
    body * {
       display: none;
    }
    #printDiv, #printDiv * {
       display: block !important;
    }
    #printDiv {
       position: absolute;
       left: 0;
       top: 0;
    }
}