打印时隐藏JavaScript菜单

Question

我正在尝试在打印时隐藏JavaScript菜单。

我可以使用print.css隐藏其他项目，例如标题和我的rightnav，这只是一个包含5个链接的列表，但无法隐藏菜单。所以我知道我的print.css正在处理一些项目。

    <div id="leftnav">
       <script type=text/javascript>
       //HV Menu v5.411- by Ger Versluis (http://www.burmees.nl/)
       //Submitted to Dynamic Drive (http://www.dynamicdrive.com)
       //Visit http://www.dynamicdrive.com for this script and more
       function Go(){return}
       </script>
       <script src="menu_var2.js" type=text/javascript></script>
       <script src="menu_com.js" type=text/javascript></script>
    </div>

    <div id="content">
       stuff to be printed
    </div>

Answer 1

您可以使用媒体查询css选择器@media print。

尝试在样式表中添加以下内容：

@media print { 
#leftnav { 
display: none;
} 
}

Answer 2

使用@media print：

@media print { 
  #leftnav { 
    display: none;
  } 
}

现在，在以下代码段中，尝试打印它：

@media print { 
  #menu { 
    display: none;
  } 
}

<div id="menu">
  This will not show in print.
</div>
<div>
  This will come in Print.
</div>

使用Chrome，我得到了这个：