打印媒体查询不适用于iOS(铬,Safari,Mozilla)
问题描述:
我想知道为什么@media print
似乎无法在iOS上工作,在Android上的功能工作正常。基本上我做了一个功能,以隐藏不属于打印打印媒体查询不适用于iOS(铬,Safari,Mozilla)
body.printing *{display : none}
的一部分的内容,只显示将要打印的
body.printing .print-me, body.printing .print-me > div{display : block}
内容。
$('.print-modal').on('click', function() {
$('body').addClass('printing');
window.print();
$("body").removeClass("printing");
})
@media print {
/* Hide everything in the body when printing... */
body.printing * { display: none; }
/* ...except our special div. */
body.printing .print-me, body.printing .print-me > div { display: block; }
}
@media screen {
/* Hide the special layer from the screen. */
.print-me { display: none; }
}
答
也许问题是,您要添加类printing
且立即将同一类。这可能是原因。
尝试更改逻辑。您不需要添加打印类。请使用打印介质查询@media print
来处理打印逻辑。
$('.print-modal').on('click', function() {
window.print();
})
@media print {
/* Hide everything in the body when printing... */
body * { display: none; }
/* ...except our special div. */
body .print-me, body .print-me > div { display: block; }
}
@media screen {
/* Hide the special layer from the screen. */
.print-me { display: none; }
}
在iOS中打印什么? – sabithpocker
@sabithpocker整个页面 – clestcruz
甚至不打扰设置'打印'类 - 这是'@media print'的全部要点 –