无需javascript修改即可打印

我有一个通过javascript控制的选项卡视图网站。禁用JS后，选项卡彼此垂直对齐。在document.ready中，调用了一个函数，该函数重新设置选项卡的范围，使其相互重叠，因此您必须单击选项卡标题以显示内容

当我调用window.print时，元素不会像没有javascript时那样显示，而是彼此重叠，这对于网站的纸质版来说是次优的

在调用window.print之前，是否有其他方法或必须重新排列项目，使其恢复到没有JS时的外观

编辑： 一般来说，它是这样工作的：

$(document).ready(function()
{
    $('.btn1').click(function()
    {
       $('.tile2').css('display', 'none');
       $('.tile1').css('display', 'block');
    });
    $('.btn2').click(function()
    {
       $('.tile1').css('display', 'none');
       $('.tile2').css('display', 'block');
    });
    $('.tile2').css('display', 'none');                  
});

---

使用打印css覆盖JS应用的样式

<link rel="stylesheet" href="print.css" type="text/css" media="print" />

---

请给我们一些代码。HTML、JS和CSS