通常 @media print and (orientation: landscape) 可以查询到横向打印,不过如果页面是在 iframe 中则 orientation 不起作用。

尝试了一下在 Chrome 下 A4 打印,宽度的 break point 大概在 842px 或 22.27cm,前提是 margin padding 都为 0 的情况。

这个 magic number 无疑是不稳定的,临时凑合用。

codepen demo

发现 codepen 的嵌入式 demo 是 iframe 套 iframe,还不起作用,得去codepen 上直接看才行。

update:
测了一下 Firefox 下是 1121px / 29.66cm,Edge 是 1122px / 29.69cm,基本接近 A4 的大小。