打印時爲什麼頁面元素不會隱藏？

我有一個網站，我正在努力在哪裏有「打印頁面」按鈕。當頁面打印時，I 想要隱藏頁面的某些元素（例如，左側導航欄，頂部導航欄等）。打印時爲什麼頁面元素不會隱藏？

我已經加入這個我style.css文件：

@media print { 
    #topnav { display:none } 
    #left-col { display:none } 
}

然而，當我去看看網頁的打印預覽，這些因素仍然存在。

任何幫助將不勝感激！

來源

2012-08-12 Cynthia

我在這裏用Firefox 14和Chrome打印預覽最新：http://jsfiddle.net/gQfJn/embedded/result/（[editable version]（http://jsfiddle.net/gQfJn/））它隱藏。（IE9打印預覽不顯示任何內容？但認爲有兩頁？）您需要提供更多信息，最好是您的問題的工作演示。 – 2012-08-12 14:42:19

我想出了導致問題的原因。我有media = screen作爲我的style.css調用的一部分。一旦我刪除了它，它效果很好！ – Cynthia 2012-08-12 14:46:31

作爲答案發布（描述發生的事情和錯誤的標記），以便以後的用戶可以看到如何「修復」它。 – 2012-08-12 14:47:21

我想通了。這是我的編碼錯誤。我原來的鏈接到我的樣式表是這樣的：

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

，並導致衝突。一旦我刪除media="screen"它完美的工作。

來源

2012-08-12 15:03:53 Cynthia

你可以試試下面的代碼：

HTML代碼

<input type="submit" id="print" value="Submit">

JS代碼

$(document).ready(function(){ 
    $('#print').on('click', function(){ 
     $('selector i.e #leftnav, #topnav').die(); 
    }); 
    });

$('selector i.e #leftnav, #topnav').hide();

來源

2012-08-12 14:48:34 Codegiant

哦，不，首先，不需要Javascript來解決具體問題。其次，JavaScript甚至沒有建議。第三，基於jQuery的答案是不必要的，並且對這個問題有戲劇性的矯枉過正。 – 2012-08-12 15:07:55

打印時爲什麼頁面元素不會隱藏？

回答

相關問題