2011-11-22 22 views
6

Tôi đã ngắt trang hoạt động cho phương tiện in nhanh chóng page-break-after: always. Tôi sử dụng các báo cáo này để phân tách nhiều báo cáo trong một lệnh in theo đợt. Thật không may, khi lệnh in bị hai mặt, ngắt trang có thể khiến máy in bắt đầu báo cáo ở mặt sau của báo cáo trước đó.Ngay cả ngắt trang cho in hai mặt trong HTML & CSS

Có cách nào để buộc một ngắt trang đến một trang chẵn không? Hoặc, cách khác, để phát hiện số trang nào mà một phần tử nhất định sẽ xuất hiện?

Trả lời

1

Không có chức năng tích hợp trong CSS cho việc này.

Một ý tưởng:
Bạn có lẽ có thể thử gói mỗi báo cáo của bạn trong một div và sau đó sử dụng một cái gì đó giống như jquery để làm việc ra các height của div để tìm hiểu xem nó kết thúc trên một trang lẻ.

Nếu nó kết thúc trên một trang lẻ, sau đó tiêm một div trống với lớp sau khi ngắt trang của bạn sau đó để nó cấp dữ liệu cho trang tiếp theo.

EDIT
Rõ ràng điều này sẽ chỉ thực sự hoạt động nếu bạn biết dpi mà tại đó trang của bạn in trên máy in đích. Không có câu trả lời kỳ diệu nào sẽ chỉ hoạt động cho mọi tình huống.

  • 72 dpi (web) = 595 X 842 pixel
  • 300 dpi (in) = 2480 X 3508 pixel ("210mm X 297mm @ 300 dpi")
  • 600 dpi (in) = 4960 X 7016 pixel

Bạn cần thử nghiệm một chút ở đây với cài đặt máy in chuẩn để xem điều gì phù hợp với bạn/(các) khách hàng của bạn. Nếu có nhiều trường hợp, bạn có thể cho phép họ chọn từ menu thả xuống.

Vì vậy, bạn nên sử dụng jquery để kiểm tra chiều cao pixel của div, kiểm tra chiều cao pixel của trang để xem liệu div kết thúc trên một trang lẻ hay thậm chí - sau đó tiêm ngắt trang nếu báo cáo kết thúc trên một trang lẻ.

Bạn cũng cần phải biết trước nếu người dùng sẽ sử dụng in hai mặt - vì bạn chỉ cần thực hiện việc này để in hai mặt.

+0

Ý tưởng thú vị - có cách nào để biết (hoặc đặt) chiều cao của trang không? –

+0

@RileyLark, tôi đã chỉnh sửa câu trả lời của tôi ở trên để cung cấp cho bạn một số thông tin. – Nils

5

Có chức năng CSS trong tiêu chuẩn. Bạn đang đi đúng hướng. Sử dụng:

<div style="page-break-after: right"> 
-- your content -- 
</div> 

Hiện tại, trình duyệt chính duy nhất hỗ trợ này là Opera. Opera có những vấn đề khó khăn với việc in ấn, nhưng nó có thể phù hợp với hoàn cảnh của bạn.

+6

Bạn không cần phải viết nó như 'style =" page-break-after: right "'? –

Các vấn đề liên quan