Quy tắc tốt để thiết lập css in?

Question

Tôi đang tìm bất kỳ đề xuất/quy tắc/hướng dẫn nào về việc tạo một css in ấn phù hợp khi trang web được in. Bạn có bất kỳ để cung cấp?

Answer 1

Dưới đây là một số phong cách in chung để sử dụng để có được outs in tốt hơn:

/* Print styles */ 
@media print 
{ 
    tr, td, th {page-break-inside:avoid} 
    thead {display:table-header-group} 
    .NoPrint {visibility:hidden; display:none} 
    a {color:#000000} 
} 

Một đầu ngăn ngắt trang bên trong của một dòng của bảng

Phong cách thead làm cho bất kỳ hàng trong thẻ thead lặp lại cho mỗi trang mà bảng trải dài trên.

NoPrint là lớp tôi sử dụng để hiển thị nội dung nào đó trên màn hình nhưng không in được.

Và tôi muốn tắt màu liên kết.

Answer 2

Xem ra hình nền và màu sắc. Tôi nghĩ rằng hành vi mặc định của IE không phải là để in ra hình nền hoặc màu sắc.

Answer 3

Bạn có tên cũ này nhưng vẫn có liên quan article from Eric Meyer trên một Danh sách.

Điểm chính là để bắt đầu lại từ đầu, thiết lập một cách rõ ràng biên giới và marging/padding để 0, nền trắng, và "hiển thị none" để bất kỳ yếu tố không cần thiết cho in ấn (như menu nào đó)

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

body { 
    background: white; 
    } 

#menu { 
    display: none; 
    } 

#wrapper, #content { 
    width: auto; 
    margin: 0 5%; 
    padding: 0; 
    border: 0; 
    float: none !important; 
    color: black; 
    background: transparent; 
    } 

Và đi từ đó.

Answer 4

Đầu tiên đọc bài viết này từ Danh sách Ngoài (http://www.alistapart.com/articles/goingtoprint/). Chúng bao gồm rất nhiều điều cơ bản bạn đang tìm kiếm (các liên kết mở rộng, quét trắng, vv).

Không dựa vào bản xem trước bản in, hãy đảm bảo thực hiện toàn bộ quá trình khi thử nghiệm bố cục in. Để lưu giấy cài đặt SnagIt hoặc sử dụng trình soạn thảo tài liệu Microsoft XPS. Bạn có thể in trực tiếp hình ảnh và không lãng phí bất kỳ giấy tờ nào.

Ngoài các bài viết dài, hãy cân nhắc việc thay đổi phông chữ thành serif. Các bài viết trên web dễ đọc nhất trong sans-serif (Arial, Verdana) nhưng trong bản in thử Times New Roman hoặc Georgia.

Answer 5

Khi bạn xác định kiểu in, bạn phải suy nghĩ trên giấy và trong các đơn vị vật lý.

• Đặt lề bằng cm (inch) và kích thước phông chữ theo điểm (giống như trong OpenOffice).
• Tạo một lớp học như 'màn hình' hoặc 'noprint' để có thể dễ dàng xóa tài liệu không mong muốn.
• Quên văn bản màu ưa thích. Văn bản màu đen trên nền trắng.
• Hãy suy nghĩ về việc xóa hình ảnh thừa - chúng có thể trông không đẹp bằng màu đen và trắng
• Xóa gạch dưới khỏi liên kết và tạo liên kết có văn bản lành mạnh. Có vẻ ngớ ngẩn khi đọc "kiểm tra trang này", trong đó "này" được gạch dưới. Hoặc nếu bạn đặt href của liên kết sau văn bản được gạch dưới, thì nó có thể hữu ích hơn nhưng trông không đẹp như vậy.

Answer 6

Một điều mà tôi chắc chắn phải đặt trong style sheet in của tôi là:

a[href^="http://"]:after{ 
    content: " (" attr(href) ") "; 
} 

này viết vào liên kết thực tế bên cạnh liên kết văn bản để người in tập tài liệu sẽ biết là những liên kết được giả đi.

Tôi cũng thiết lập văn bản cơ thể của tôi là một chút dễ đọc hơn cho việc in ấn:

body{ 
    font: 0.9em/1.5em Georgia, "Times New Roman", Times, serif; 
}