क्रोम प्रिंट पूर्वावलोकन DEVTools

से अलग है मैंने एक प्रिंट स्टाइलशीट सेट की है और फ़ायरफ़ॉक्स में यह अच्छी तरह से दिखता है।क्रोम प्रिंट पूर्वावलोकन DEVTools

क्रोम में पूरे पृष्ठ मुद्रण पूर्वावलोकन (Ctrl + P) में टूट गया है, लेकिन अगर मैं Chrome DevTools (F12) खोलने के लिए और emulate CSS media फ़ंक्शन का उपयोग करें पेज सही लगती है - फ़ायरफ़ॉक्स में की तरह।

अजीब बात यह है कि अगर मैं एक बार फिर से अनुकरण विकल्प सक्रिय करने के बाद प्रिंट पूर्वावलोकन खोलता हूं, तो पृष्ठ प्रिंट पूर्वावलोकन में सही दिखता है! यहां तक कि यदि मैं अभी सक्रिय करता हूं और फिर अनुकरण विकल्प को निष्क्रिय करता हूं, तो प्रिंट पूर्वावलोकन हमेशा ऐसा करने के बाद सही होता है!

मेरे print.css

@media print { ... }

साथ शुरू होता है और इस तरह पेज <head> में शामिल है:

<link rel="stylesheet" type="text/css" href="print.css" media="print">

मैं media="print" लेकिन कुछ भी परिवर्तन को दूर करने की कोशिश की है।

स्रोत

2014-09-24 Keith L.

अपने प्रिंट शैली पत्रक में, आपको निम्न जोड़ सकता हूँ की जरूरत है:

*{transition:none!important}

ऐसा लगता है कि क्रोम प्रिंट मीडिया के लिए संक्रमण संपत्ति को निष्क्रिय नहीं है।

Here वह जगह है जहां मुझे जवाब मिला।

स्रोत

2015-01-19 21:36:28 Ustice

केवल मीडिया प्रिंट के लिए, मैंने इस शैली को जोड़ा है। अगर हम इस सीएसएस को आम तौर पर लागू करते हैं, तो यह काम करता है।अगर हम केवल मीडिया प्रिंट के लिए आवेदन करते हैं, तो यह काम नहीं कर रहा है। क्या कोई काम आसपास है? :-( –

@ जीवाजेएसबी - मुझे एक ही समस्या थी। संभावित कार्यवाही के लिए मेरा उत्तर देखें। –

उस्टिस के उत्तर और जीवन जेएसबी की टिप्पणी में जोड़ने के लिए: आपको transition: none !important नियम लागू करने के बाद डीओएम को फिर से प्रस्तुत करने की अनुमति देनी पड़ सकती है। मैं शरीर के लिए एक print CSS वर्ग जोड़कर इस निपुण इससे पहले कि मैं प्रोग्राम के रूप में पृष्ठ को प्रिंट:

सीएसएस:

body.print * { 
    transition: none !important; 
}

जे एस (jQuery का उपयोग):

$('body').addClass('print'); 
setTimeout(function() { 
    window.print(); 
}, 0);

के लिए मत भूलना एक बार आपके उपयोगकर्ता ने पृष्ठ मुद्रित करने के बाद print कक्षा को हटा दें। (how to detect window.print() finish देखें।)

स्रोत

2016-09-22 14:02:00

मैं ठीक उसी सिर तोड़ने की समस्या में भाग गया और मैं इसे ठीक करने में सक्षम हूं।

मेरे मामले में समस्या 'प्रिंट' सीएसएस के लिए कस्टम @ फ़ॉन्ट-फेस का उपयोग करके हुई थी जिसे मैंने 'स्क्रीन' सीएसएस में उपयोग नहीं किया था।

ऐसा लगता है कि ब्राउज़र पहले प्रिंट के लिए प्रिंट स्टाइलशीट से कस्टम @ फ़ॉन्ट-फेस लोड नहीं करता है और पृष्ठ को कम या ज्यादा खाली करता है। यह दूसरे प्रिंट पूर्वावलोकन पर पूरी तरह से प्रस्तुत करेगा।

मेरा समाधान स्क्रीन सीएसएस में पिंट सीएसएस से समान @ फ़ॉन्ट-फेस नियम लोड करना था। इस तरह प्रिंट पूर्वावलोकन को देखते समय फ़ॉन्ट पहले से ही ब्राउज़र द्वारा लोड किया जाता है और यह सब एक आकर्षण की तरह काम करता है।

स्रोत

2017-01-30 09:43:04

क्रोम प्रिंट पूर्वावलोकन DEVTools

उत्तर

संबंधित मुद्दे