Kiểu in: Cách đảm bảo hình ảnh không bị ngắt trang

Question 1

Khi viết một biểu định kiểu in, có cách nào để đảm bảo rằng hình ảnh luôn chỉ nằm trên một trang duy nhất, thay vì kéo dài nhiều trang. Các hình ảnh nhỏ hơn nhiều so với trang, nhưng dựa trên luồng tài liệu, chúng sẽ nằm ở cuối trang và bị tách ra. Dưới đây là một ví dụ về hành vi mà tôi đang thấy:

Page 1 |                    |
       |  (text text text)  |
       |  (text text text)  |
       |  ________________  |
       | | Top of image   | |
       |____________________|
       ------page break------
        ____________________
Page 2 | | Rest of image  | |
       | |________________| |
       |         …          |

Những gì tôi muốn

Page 1 |                    |
       |  (text text text)  |
       |  (text text text)  |
       |                    |
       |                    |
       |____________________|
       ------page break------
        ____________________
Page 2 |  ________________  |
       | | Full image     | |
       | |                | |
       | |________________| |
       |         …          |

Tất cả những lần tôi phàn nàn về float trong LaTeX, và ở đây tôi yêu cầu chức năng tương tự ... Điều này có thể thực hiện được không? Tôi không nhất thiết phải lo lắng về việc nó hoạt động trên tất cả các trình duyệt, vì đây thường chỉ là tài liệu một lần tôi đang viết để được chuyển thành PDF.

Question 2

Phương tiện duy nhất tôi có thể nghĩ đến là sử dụng một (hoặc có thể nhiều hơn) trong các quy tắc css sau:

img {
    page-break-before: auto; /* 'always,' 'avoid,' 'left,' 'inherit,' or 'right' */
    page-break-after: auto; /* 'always,' 'avoid,' 'left,' 'inherit,' or 'right' */
    page-break-inside: avoid; /* or 'auto' */
}

Tôi xin nhắc lại rằng những khai báo này chỉ áp dụng cho các phần tử cấp khối (vì vậy bạn cũng phải xác định display: block;trên hình ảnh của mình hoặc sử dụng một số loại vùng chứa bao bọc và áp dụng các quy tắc cho điều đó (cho dù đó là trong một đoạn văn, div, span , danh sách, v.v ...).

Một số thảo luận hữu ích ở đây: " Thuộc media="print"tính CSS tương thích với nhiều trình duyệt cụ thể nhất của quy tắc sử dụng nào? "

Người giới thiệu: