सीएसएस: पृष्ठ-ब्रेक-पहले, हमेशा, पहली बार छोड़कर?

मैं एक सुंदर प्रिंट एचटीएमएल पेज बनाने की कोशिश कर रहा हूं। मुझे शीर्ष-स्तरीय संरचनाओं के बीच एक पृष्ठ-ब्रेक को मजबूर करने की आवश्यकता है, इसलिए मैंने प्रत्येक निर्माण के शीर्ष-स्तर तत्व में एक सीएसएस क्लास जोड़ा, और पेज-ब्रेक-पहले सेट किया: हमेशा उस कक्षा के लिए सीएसएस में। उदा।सीएसएस: पृष्ठ-ब्रेक-पहले, हमेशा, पहली बार छोड़कर?

<body> 
<div class="prettyprint"> 
    <div class='toplevel'> 
     ... 
    </div> 
    <div class='toplevel'> 
     ... 
    </div> 
</div> 
</body> 

.prettyprint .toplevel { page-break-before:always; }

मेरी समस्या यह है कि मुझे पहले शीर्ष-स्तर तत्व से पहले एक खाली पृष्ठ मिलता है। जो पृष्ठ-ब्रेक-पहले पहले विचार करता है: हमेशा ऐसा करना चाहिए। लेकिन मुझे यह नहीं चाहिए।

तो, एक विकल्प में पहले तत्व में "अपूर्ण" कक्षा शामिल नहीं है, या एक नई "फर्स्टटेलप्लेवल" कक्षा प्रदान नहीं करना है जो पेज-ब्रेक-पहले सेट नहीं करता है: हमेशा, और इसे पहले के लिए सेट करें शीर्ष-स्तर तत्व, और फिर अन्य सभी के लिए "toplevel" का उपयोग करें। मैं इसे आसानी से कर सकता था, लेकिन ऐसा लगता है कि यह चिंताओं को अलग करने का उल्लंघन कर रहा है।

तो मैं सोच रहा था कि सीएसएस में ऐसा करने का कोई तरीका है या नहीं? एक नियम निर्धारित करने के लिए जो केवल "सुंदर प्रिंट" के पहले "अपूर्ण" बच्चे पर लागू होगा?

किसी भी विचार की सराहना की जाएगी।

स्रोत

2010-08-02 Jeff Dege

:first-child

काम हो सकता है, लेकिन यकीन है कि वहाँ IE6 में समस्याएं हैं, देखें: http://www.quirksmode.org/css/firstchild.html

संपादित करें: IE6 में काम नहीं करता है, और के लिए IE doctype के नए संस्करण में यह काम करने के लिए इस्तेमाल किया जाना चाहिए। क्रोम V56 पर अच्छी तरह से https://css-tricks.com/almanac/properties/p/page-break/

निम्नलिखित काम करता है:

स्रोत

2010-08-02 19:53:18 Alex

+1 सबसे अच्छा तरीका है मैं के बारे में सोच सकते हैं। आप IE6 के लिए कार्यक्षमता जोड़ने के लिए jQuery का उपयोग कर सकते हैं। –

आईई वर्तमान संस्करण में भी कुछ प्रिंटों को तोड़ता है [कम से कम मेरे लिए किया गया], मुझे आईई 6 के बारे में ज्यादा परवाह नहीं है: पी – naugtur

आप एक smrt आदमी हैं। – Pat

<style> 
     .prettyprint { 
      page-break-before: always; 
      margin-top:0; 
     } 

     .prettyprint :first-of-type { 
      page-break-before: avoid; 
     }

स्रोत

2016-12-16 18:41:47 John

एक स्पष्टीकरण फायदेमंद होगा – happymacarts

पर पृष्ठ विराम पर एक अच्छा विवरण देखें। एक नियम बनाएं जो page-break-before:always लागू करता है लेकिन उस नियम को दबाएं जब इसे इसके पहले प्रकार पर लागू किया जाता है।

.print-per-page { 
 
    page-break-before: always; 
 
} 
 

 
.print-per-page:first-of-type { 
 
    page-break-before: avoid; 
 
}

<div> 
 
    <div class="print-per-page">Page 1</div> 
 
    <div class="print-per-page">Page 2</div> 
 
    <div class="print-per-page">Page 3</div> 
 
</div>

स्रोत

2017-02-18 00:08:30

सीएसएस: पृष्ठ-ब्रेक-पहले, हमेशा, पहली बार छोड़कर?

उत्तर

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