我可以使用 CSS 反转两个元素的显示顺序吗？

这听起来很疯狂，但请耐心听我说。我正在编写一个页面，基本上包含以下内容：

<div id="container">
    <div id="child1">...</div>
    <div is="child2">...</div>
</div>

我希望页面显示不同，具体取决于它是为屏幕渲染还是打印，通过媒体查询的魔力实现。特别是，在打印时，我想要#child2出现在页面上before #child1.

有什么方法可以在不诉诸javascript的情况下交换它们的顺序，并且最好不使用令人讨厌的绝对定位之类的东西？

我应该补充一下，在这种情况下，“之前”的意思是“直接在下面”。

是的，使用弹性盒 -http://jsfiddle.net/F8XMk/

#container{
  display: flex;    
  flex-flow: column;
}

#child1{
  order: 2;
}

#child2{
  order: 1;    
}

较新的浏览器对 Flex 的支持非常好。你也可以用负边距来破解它:)