आप वेब पेज को प्रिंटर पर ब्राउज़र विंडो में क्या कुछ अलग कर सकते हैं?

Question

Google मानचित्र इस बिट को करने के लिए उपयोग किया जाता है, जहां आप "प्रिंट" लिंक दबाते हैं, प्रिंटर को जो भेजा जाएगा वह बिल्कुल स्क्रीन पर नहीं था, बल्कि अधिकतर जानकारी के एक अलग रूप से स्वरूपित संस्करण था।

ऐसा प्रतीत होता है कि वे काफी हद तक इस अवधारणा से दूर चले गए हैं (मुझे लगता है कि लोग इसे समझ में नहीं आये हैं) और अधिकांश वेबसाइटों में लेखों जैसे लेखों का "प्रिंट संस्करण" होता है और आगे।

लेकिन यदि आप एक वेबपृष्ठ बनाना चाहते हैं जैसे कि पृष्ठ का "प्रिंटर अनुकूल" संस्करण प्रिंटर को इसके लिए एक अलग पृष्ठ बनाने के बिना भेजा जाता है, तो आप यह कैसे करेंगे?

अनुवर्ती: क्या आपके पास चीजें मुद्रित की जा सकती हैं जो पृष्ठ पर प्रस्तुत नहीं की जाती हैं? (यानी, वर्तमान में प्रस्तुत किए जाने से छुपा)?

Answer 1

हां, आप एक प्रिंटर सीएसएस लागू कर सकते हैं। here के बारे में एक अच्छा लेख है।

Answer 2

जब आप प्रिंट के रूप में मीडिया निर्दिष्ट करते हैं तो आप इसे सीएसएस के साथ कर सकते हैं।

Answer 3

print stylesheet का उपयोग करें।

संपादित करें: फॉलोअप के संबंध में, आप सामान्य रूप से, सीएसएस के साथ किसी पृष्ठ पर चीजें जोड़ नहीं सकते हैं।

एक विकल्प पृष्ठ में अपनी प्रिंट-केवल सामग्री शामिल करना है, और स्क्रीन स्टाइलशीट के लिए इसे छिपाना है। आपको यह सुनिश्चित करना चाहिए कि पृष्ठ अभी भी सीएसएस के बिना समझ में आता है।

एक और विकल्प जेनरेट की गई सामग्री का उपयोग करना है, लेकिन यह इंटरनेट एक्सप्लोरर 7 और नीचे समर्थित नहीं है, और यह काफी सीमित हो सकता है।

यदि प्रिंट-केवल सामग्री एक छवि है, तो आप इसे लोकप्रिय छवि प्रतिस्थापन तकनीकों में से एक का उपयोग करके स्वैप कर सकते हैं।

Answer 4

एक और तरीका, अगर वांछित है, तो पृष्ठ पर 'प्रिंट' बटन पृष्ठ को किसी भी तरीके से बदलना है, फिर आप जावास्क्रिप्ट 'window.print();' ब्राउज़र के प्रिंट संवाद लाने के लिए।

Answer 5

सीएसएस मीडिया प्रकारों का उपयोग करना सबसे आसान तरीका है। आपके द्वारा शामिल प्रत्येक सीएसएस फ़ाइल के लिए, आप निर्दिष्ट कर सकते हैं कि इसे कहां उपयोग किया जाना चाहिए: ऑन-स्क्रीन, प्रिंटिंग करते समय, हैंडहेल्ड के लिए, स्क्रीन-पाठकों के लिए, या इनमें से विभिन्न संयोजन।

उदाहरण: < लिंक rel = "स्टाइलशीट" type = "text/css" मीडिया = "प्रिंट, हाथ में" href = "foo.css" >

यह सीएसएस 2 के बाद से एक मानक किया गया है, और अधिकांश ब्राउज़र अब इसका समर्थन करते हैं। अधिक जानकारी यहां उपलब्ध है: http://www.w3.org/TR/CSS2/media.html

Answer 6

आप एक सीएसएस स्टाइलशीट बनाकर इस प्रभाव को प्राप्त कर सकते हैं जिसे सीधे प्रिंट करने के लिए लक्षित किया गया है, और दूसरा स्क्रीन के लिए सीधे लक्षित है।

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

अपने दस्तावेज़ में अपने स्टाइलशीट एम्बेड करने के लिए:

लिंक टैग का प्रयोग करें।

छिपाने के लिए आसान है, बस अपनी ब्लॉक शैली को जो भी स्टाइलशीट आप चाहते हैं उसे छिपाने के लिए सेट करें और यह प्रदर्शित नहीं होगा। उदाहरण के लिए:

.newStyle1 { 
    display: none; 
} 

तो कुछ भी newStyle1 की शैली के लिए सेट प्रदर्शित नहीं किया जाएगा।

Answer 7

वहाँ आप के लिए कई विकल्प उपलब्ध हैं:

• आप थोड़ा अलग डेटा के साथ एक नई विंडो खोल सकते हैं मुद्रित करने के लिए।
• सीएसएस शैलियों भी हैं जिनका उपयोग आप पृष्ठ लेआउट को बदलने के लिए कर सकते हैं।
• अंत में आप स्क्रीन के लिए पूरी तरह से अलग शैली पत्रक, प्रिंट मीडिया, ब्रेल पाठकों आदि

जैसे निर्दिष्ट कर सकते हैं <link href="css/print.css" type="text/css" rel="stylesheet" media="print" />

भी देखें CSS2 Print Reference

Answer 8

सीएसएस जिसका अर्थ है आप कि तभी लागू होता है जब आप एक पेज प्रिंट कर रहे हैं, आप इसे पैदा करने के लिए अनुमति देता है प्रारूप तैयार किया जाता करने के लिए एक स्टाइलशीट हो सकता है, आप मीडिया के किसी विशिष्ट प्रकार के लिए स्टाइलशीट बनाने की अनुमति देता अलग ढंग से।

बस उस स्टाइलशीट के लिए अपने स्टाइलशीट लिंक पर एक मीडिया = "प्रिंट" विशेषता शामिल करें।

यह A List Apart article विषय पर काफी अच्छा लगता है।

Answer 9

मैंने मीडिया के आधार पर विभिन्न स्टाइल शीट का उपयोग करने की कोशिश की, लेकिन मुझे आवश्यक सभी विकल्पों को प्राप्त करने में परेशानी हो गई। तब से मैं आमतौर पर हमारे (फ्यूजबॉक्स) ढांचे के एक अलग प्रवेश द्वार पर रीडायरेक्ट करता हूं (यानी print.php स्थिरता में index.php का) जो संक्षेप में एक ही फ़ाइल है, सिवाय इसके कि यह एक अतिरिक्त ध्वज/स्थिर सेट करता है।

पृष्ठ से संबद्ध मैं तो उस ध्वज के आधार पर अतिरिक्त काम करने XSL फ़ाइल में/मेनू बाहर छोड़ने की तरह निरंतर, एक तालिका के कॉलम आदि

यानी (पृष्ठ एक लिंक उपयोगकर्ता है कि पता चलता है स्क्रीन पर प्रदर्शित करने के लिए पासवर्ड पर क्लिक करें। प्रिंट संस्करण पासवर्ड मुद्रित है।)

if (!BOOL_PRINT) 
    echo "<TD class=\"tbl_teams_scroll_item\"><SPAN class=\"span_password_hidden\" id=\"span_password_{\$team_id}\" onClick=\"RevealPassword('{\$team_id}','{\$password}');\"><xsl:value-of select=\"/PAGE/TEXTS/HIDDEN\" /></SPAN></TD>\n"; 
else 
    echo "TD class=\"tbl_teams_scroll_item\"><xsl:value-of select=\"PASSWORD\" /></TD>\n"; 

Answer 10

सीएसएस में @media नियम अक्सर नेविगेशन छिपाने के लिए और बदलने के लिए प्रयोग किया जाता है print.This के लिए वैकल्पिक नियमों को परिभाषित करने के लिए इस्तेमाल किया जा सकता है प्रिंट बेहतर फिट करने के लिए शैली:

@media print { 
    .sidebar { display: none; } 
} 

तुम भी प्रिंट के लिए एक अलग स्टाइलशीट लिंक कर सकते हैं:

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

Answer 11

आप सीएसएस नियम है कि एक मीडिया प्रकार के लिए विशिष्ट हैं परिभाषित कर सकते हैं। निम्नलिखित एक सीएसएस उदाहरण है (http://www.w3.org/TR/CSS2/media.html, सेक्शन 7.2.1 से कॉपी किया गया है) जो वेब पेज पर प्रदर्शित होने वाले विभिन्न फ़ॉन्ट आकार निर्दिष्ट करता है और क्या मुद्रित होता है।

@media print { 
    BODY { font-size: 10pt } 
    } 
    @media screen { 
    BODY { font-size: 12pt } 
    } 
    @media screen, print { 
    BODY { line-height: 1.2 } 
    } 

वैकल्पिक रूप से, आप निर्दिष्ट कर सकते क्या मीडिया एक स्टाइलशीट जब यह एक पेज में शामिल करने के लिए लागू किया जाना चाहिए:

<link href="webstyles.css" type="text/css" rel="stylesheet" media="screen"/> 
<link href="printstyles.css" type="text/css" rel="stylesheet" media="print"/> 
<link href="commonstyles.css" type="text/css" rel="stylesheet" media="screen,print"/> 

Answer 12

फिर भी एक और विकल्प एक छिपा IFRAME कि आप iframe.contentWindow फोन है। प्रिंट() पर। यह आपको एक अदृश्य लेआउट बनाने की अनुमति देगा जो प्रिंट करता है जैसा आप चाहते हैं।

बेशक, फ़ाइल को पीडीएफ में निर्यात करने का एक बेहतर समाधान है और उपयोगकर्ता को इसे इस तरह से प्रिंट करने दें। पीडीएफ उच्च गुणवत्ता वाले उत्पादन, अवधि का उत्पादन करते हैं। हालांकि, यह उपयोगकर्ता के माध्यम से कूद करने के लिए एक और घेरा है, इसलिए अंगूठे का नियम है: जब प्रिंट लेआउट मायने रखती है जब शुद्ध पाठ लेआउट से ज्यादा महत्वपूर्ण है के लिए

HTML के लिए

• पीडीएफ़

Answer 13

nsayer का उल्लेख है एक प्रिंट बटन अपनी स्क्रीन का लेआउट परिवर्तित और फिर बंद लात होने एक window.print()

यह एक समाधान है कि शायद बहुत से लोगों को द्वारा अनदेखी की है जाएगा और whe विचार किया जाना चाहिए है n आपको लगता है कि आपके उपयोगकर्ता WYSIWYG का थोड़ा और चाहते हैं। यह शायद "प्रिंटर अनुकूल" लिंक होना चाहिए, हालांकि यह "प्रिंट प्रिंट" के बजाय आपकी शीट शीट के मीडिया प्रकार को बदलता है।

$(document).ready(function(){ 
    $("#printFriendly").click(function(){ 
     $(link[rel=link][media=screen]).remove(); 
     $(link[rel=link][media=print]).attr("media","screen"); 
    }); 
}); 

Answer 14

कुछ भी आप सीएसएस के साथ कर सकते आप एक प्रिंट स्टाइलशीट में कर सकते हैं:

jQuery का उपयोग करना, आप कुछ इस तरह (नहीं की जाँच) कर सकता है। इसका अर्थ यह है कि आप प्रिंट संस्करण में सामग्री को छुपा सकते हैं जो स्क्रीन संस्करण में दिखाया गया है या स्क्रीन संस्करण में सामग्री को छुपाएं जिसे आप प्रिंट करते समय दिखाना चाहते हैं। आप जो भी करते हैं वह डिस्प्ले लागू होता है: उचित स्टाइलशीट में उपयुक्त अनुभागों में से कोई भी नहीं।

प्रिंट संस्करण के लिए अंक में अपने टेक्स्ट को आकार देने का एक अच्छा विचार है (जो खराब स्क्रीन संस्करण के लिए विचार है - यहां पिक्सेल, ईएमएस या प्रतिशत से चिपकें)। मुद्रित बिंदु आकार के रूप में सार्वभौमिक समझौता है जहां पिक्सल के अंक के मैपिंग अलग-अलग रिज़ॉल्यूशन उपकरणों के साथ भिन्न होंगे।

Answer 15

सीएसएस के साथ प्रिंटिंग ए बुक नामक प्रिंटिंग सीएसएस के बारे में एक सूची के अलावा यहां एक और लिंक है: बूम! http://www.alistapart.com/articles/boom/