如何仅在打印时相对于另一个 div 设置 div position

Question

我正在构建一个 HTML 报告，我想将一些 div 移动到另一个 div @ media print 之上。 或者，如何设置与另一个相关的 div 的 position？

例子：div_2's bottom to top of div_1 表示

div_2  
div_1

示例：div_2 的从左到右表示 div_1

div_1div_2

我可以这样做吗？

Answer 1

在许多浏览器中支持flexbox

<div class="d0">
   <div class="d1"></div>
   <div class="d2"></div>
</div>

EX1：

.d0 {
  display: flex;
  flex-direction: column-reverse;

}

EX2：

.d0 {
  display: flex;
}

Answer 2

实际上，我发现了一个非常棘手的解决方案，它可以让您在打印时更改 div 并在需要时添加分页符。 解决方案是使用 Js

    jQuery(document).bind("keyup keydown", function(e){
    if(e.ctrlKey && e.keyCode == 80){
        fd = document.getElementById( '1_div' );
        sd = document.getElementById( '2_div' );
        sd.parentNode.insertBefore( sd, fd );
    }
});