目前 CSS 是否尚無方法於列印時自動計算 Page 頁數？

css table print 列印頁碼

睿之 2021-10-19 11:08:15 ‧ 2378 瀏覽

分享至

各位邦友好，
目前在製作客製化表單，需要於網頁列印大量資料，而當 Table 的 Row 相當多時，難免會遇到列印時自動分頁，也因此衍生一個問題，當因資料筆數多時，在瀏覽器列印的自動分頁，要如何在被自動分頁的頁面上帶入頁碼？

這裡因為印製表單屬於客製化格式，所以頁碼需要在固定位置以及固定格式，無法使用瀏覽器預覽列印中提供的頁碼選項。

經過 Google 上各種關鍵字爬文，多半是使用 CSS 的 counter 來做，但這方式需要自行明確標記出分頁元素，若是 Table 有大量 Row 時的自動分頁，counter 就無法作用，是否各位有遇過相同的問題呢？

示意程式碼：

<table>
    <thead>
        <tr>
            <th>項次</th>
            <th>項目</th>
            <th>單位</th>
            <th>數量</th>
            <th>單價</th>
            <th>複價</th>
            <th>備註</th>
        </tr>
    </thead>
    <tbody>
        <!-- 1,000 行以上的資料 -->
    </tbody>
</table>

窮嘶發發發 iT邦高手 1 級 ‧ 2021-10-19 11:56:57 檢舉

因為PRINT 老實說要算分頁是有技巧的，基本上所有的欄位你要先預訂好寬度高度
超過欄位長度的只能隱藏，尤其是表格式報表，你列印出來邊界行數列數一定是固定的，或是你可以改成橫印，可以每列多印更多的字元，但是每頁的列數一定會減少，這些都是要先預估的，還有頁首頁尾的列數要先扣掉，當然如果有頁首頁尾，那每一欄老實說固定寬度之後，不太需要OVERHIDDEN的，因為超過自然就是下一頁，然後你的頁首頁尾都會有說明的，大致上這樣