Tôi đang tạo báo cáo HTML có thể in được và có "phần" sẽ bắt đầu trong một trang mới.Tôi có thể buộc một trang nhảy trong in HTML không?
Có cách nào để đặt nội dung nào đó trong HTML/CSS sẽ báo hiệu cho trình duyệt mà nó cần phải chuyển đến trang mới tại điểm đó không?
Tôi không cần điều này để làm việc trong mọi trình duyệt, tôi nghĩ tôi có thể yêu cầu mọi người sử dụng một bộ trình duyệt cụ thể để in.
Cảm ơn
Daniel
Thêm một lớp CSS được gọi là "pagebreak" (hoặc "pb"), như vậy:
.pagebreak { page-break-before: always; } /* page-break-after works, as well */
Sau đó, thêm một thẻ DIV rỗng (or any block element that generates a box) nơi bạn muốn ngắt trang.
<div class="pagebreak"> </div>
Nó sẽ không hiển thị trên trang, nhưng sẽ phá vỡ trang khi in.
Hãy thử điều này link
<style>
@media print
{
h1 {page-break-before:always}
}
</style>
Tôi nghĩ rằng đây là một câu trả lời tốt hơn vì nó không liên quan đến việc xâu chuỗi HTML để đạt được hiệu ứng hình ảnh. – FinnNk
Tôi thực sự thích người khác tốt hơn, vì nó cho tôi nhiều quyền kiểm soát hơn. Tôi luôn có thể chỉ định lớp "pagebreak" cho H1 mà nên làm cho trang nhảy. Nhưng nó vẫn là một giải pháp tốt. 1 cho @media, mặc dù màn hình nên bỏ qua trang-break-trước, tôi đoán. Cảm ơn! –
h1 là một ví dụ về những gì bạn có thể sử dụng làm thẻ cho việc ngắt in. Bạn có thể thay thế và gắn thẻ tên ở đó bạn thích.bạn cũng có thể sử dụng page-break-after: luôn luôn – jfarrell
Bạn có thể sử dụng CSS tài sản page-break-before (hoặc page-break-after). Chỉ cần đặt page-break-before: always trên các phần tử cấp khối đó (ví dụ: tiêu đề, các phần tử div, p hoặc table) sẽ bắt đầu trên một dòng mới.
Ví dụ, để gây ra một ngắt dòng trước khi bất kỳ tiêu đề cấp 2 và trước khi bất kỳ phần tử trong lớp newpage (ví dụ, <div class=newpage> ...), bạn sẽ sử dụng
h2, .newpage { page-break-before: always }
@Chris Doggett làm cho cảm giác hoàn hảo. Mặc dù, tôi đã tìm thấy một mẹo vui trên lvsys.com và nó thực sự hoạt động trên firefox và chrome. Chỉ cần đặt nhận xét này ở bất cứ nơi nào bạn muốn chèn trang-ngắt. Bạn cũng có thể thay thế thẻ <p> bằng bất kỳ phần tử khối nào.
<p><!-- pagebreak --></p>
Điều này không hoạt động –
Nhưng giống như tất cả những điều tốt đẹp trong CSS, điều này không phải lúc nào cũng làm việc liên tục trên diện rộng, nên kiểm tra Living Daylights ra khỏi nó, vì sợ rằng bạn có người dùng tức giận tự hỏi tại sao trang web của bạn in đống trang trống thêm! – Zoe
Theo MDN, 'page-break-after'" được áp dụng để chặn các phần tử tạo ra một hộp ", do đó, sử dụng phần tử' 'trống sẽ không hoạt động. Bạn nên áp dụng nó cho một phần nội dung của bạn. Xem https://developer.mozilla.org/en-US/docs/Web/CSS/page-break-after – nullability
@nullability: Good catch. Tôi đã chủ yếu sử dụng điều này tại công việc cũ của tôi trong một điều khiển WebBrowser trong WinForms sử dụng IE, tiêu chuẩn vàng của các tiêu chuẩn sau đây. –