My web page only prints onto 1 page (there is no break)_问答_开发者

My web page only prints onto 1 page (there is no break)

开发者 https://www.devze.com 2023-01-22 14:38 出处：网络

I\'m having trouble pr开发者_如何学JAVAinting a web page of information, which should span onto about 3 pages. Currently, only 1 page is printed, and the rest of the data is not visible anywhere? Is t

I'm having trouble pr开发者_如何学JAVAinting a web page of information, which should span onto about 3 pages. Currently, only 1 page is printed, and the rest of the data is not visible anywhere? Is there some JS or HTML I can use to break the page, and allow the information to continue being printed on the next pages.

You need a print stylesheet, and it should have height set to "auto" and overflow set to "visible" for the body. What I do is something like:

@media print {
    html, body { height: auto; overflow: visible; }
}

Just put that in your main CSS file or in a file of its own.

There's a pretty good article on A List Apart about preparing your site for print.

There is a known bug with floated divs getting cut off, it might be worthwhile for you to take a look.

A List Apart / CSS Design: Going to Print (See the section: Fixing a float flub)

Hope this helps!

You can also force your breaks

<style>
.break { page-break-before: always; }
</style>
<body>
content on page 1...
<h1 class="break">text of Heading 1 on page 2</h1>
content on page 2...
<h1 class="break">text of Heading 1 on page 3</h1>
content on page 3...
<p class="break">content on top of page 4</p>
content on page 4...
</body>