JavaScript+CSS控制列印格式樣本介紹

 1. 用media="print"的css來控制要列印的檔案testPrint.html中引用media為print的樣式，表示列印時該樣式才起作用 

代碼如下:<link href="/style/print.css" rel="stylesheet" type="text/css" media="print">  /style/print.css檔案  代碼如下:.noprint{display:none;}  在testPrint.html中使用print.css中的樣式，在網頁瀏覽的時候是看不出效果的，但是列印的時候會起作用，如下面這一段，加上noprint之後，在瀏覽器中仍然是現實的，但是列印的時候不顯示：  代碼如下:<div class="noprint"> <input type="button" onclick="window.print();" value="列印本頁" /> </div>  當然print.css裡面的樣式你可以隨便寫，改顏色啊（彩色的映像在黑白印表機下效果不好，可以用另一種樣式列印），字型什麼的都可以，隨便發揮-----------------------------------------------------------------  2. 用JavaScript來控制  因為這樣那樣的原因，可能有的人css不太熟練，有的人JavaScript比較牛x，有時候JavaScript也是不錯的選擇 代碼如下:<script type="text/javascript"> <!-- //自動在列印之前執行 window.onbeforeprint = function(){ $("#test").hide(); }  //自動在列印之後執行 window.onafterprint = function(){ $("#test").show(); } //--> </script>   <div id="test">這段文字不會被列印出來</div>  列印之前，會調用window.onbeforeprint函數，這時你可以隨意發揮，用你的聰明才智給html重新構造一邊，然後列印。當然列印之後一般還要弄回來，就是window.onafterprint函數了  ---------------------------------------------------------------  小技巧：注意一點，列印我們都知道是window.print()，其實也可以列印架構的，如window.top.centerFrame.MainFrame.print();