html如何設置打印樣式?


轉自網絡,忘記出處了。

html/jsp/網頁/打印相關/打印預覽/js設置頁眉頁腳

<html>
<head>
   <title>打印相關</title>
   <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
   <!--media=print 這個屬性在打印時有效 有些不想打印出來的分頁打印的都可以應用這類樣式進行控制 在非打印時是無效的(可從打印預覽中看到效果)-->
   <style media=print>
    /* 應用這個樣式的在打印時隱藏 */
    .Noprint {
display: none;
}
   
    /* 應用這個樣式的,從那個標簽結束開始另算一頁,之后在遇到再起一頁,以此類推 */
    .PageNext {
page-break-after: always;
}
</style>
   
   <!-- 這個是普通樣式 -->
   <style type="text/css">
    .tdp {
     border-bottom: 1 solid #000000;
     border-left: 1 solid #000000;
     border-right: 0 solid #ffffff;
     border-top: 0 solid #ffffff;
    }
   
    .tabp {
     border-color: #000000 #000000 #000000 #000000;
     border-style: solid;
     border-top-width: 2px;
     border-right-width: 2px;
     border-bottom-width: 1px;
     border-left-width: 1px;
    }
   
    .hr {
     font-family: "宋體";
     font-size: 9pt;
    }
   </style>

=====================================================

<script type="text/javascript">
var hkey_root,hkey_path,hkey_key
hkey_root="HKEY_CURRENT_USER";
hkey_path="\Software\Microsoft\Internet Explorer\PageSetup\";
//這個是用來設置打印頁眉頁腳的,你可以設置為空或者其它
try{
var RegWsh = new ActiveXObject("WScript.Shell");

hkey_key="header";
RegWsh.RegWrite(hkey_root+hkey_path+hkey_key,"");

hkey_key="footer";
RegWsh.RegWrite(hkey_root+hkey_path+hkey_key,"");

}catch(e){
alert(e.description());
}
</script>
</head>

<body>
<center class="Noprint">
<p>
<OBJECT id=WebBrowser classid=CLSID:8856F961-340A-11D0-A96B-00C04FD705A2 height=0 width=0 ></OBJECT>
<input type=button value=打印 onclick=document.all.WebBrowser.ExecWB(6,1)>
<input type=button value=直接打印 onclick=document.all.WebBrowser.ExecWB(6,6) />
<input type=button value=頁面設置 onclick=document.all.WebBrowser.ExecWB(8,1) />
<input type=button value=打印預覽 onclick=document.all.WebBrowser.ExecWB(7,1) />
<br />
</p>
<hr align="center" width="90%" size="1" noshade />
</center>

<table width="90%" border="0" align="center" cellpadding="2" cellspacing="0" class="tabp">
<tr>
<td colspan="3" class="tdp">
第1頁
</td>
</tr>
<tr>
<td colspan="3" class="tdp">
&nbsp;
</td>
</tr>
<tr>
<td colspan="3" class="tdp">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="50%" class="tdp">
對於這類打印功能的,有一個問題,就是權限問題,一般這種和操控客戶端東西的代碼會有安全提示,一般用戶也未必會理解,
所以像此類方法為了讓使用者更明白,還需要多加注意,可以設置瀏覽器安全性中的未標記安全的ActiveX選項為提示,看到提示后點擊(是或者允許)之類的詞。
當然最簡單但不推薦的方法就是直接設置安全性最低……
</td>
</tr>
</table>
</td>
</tr>
</table>
<hr align="center" width="90%" size="1" noshade class="hr">
<!--分頁-->
<div class="PageNext"></div>
<table width="90%" border="0" align="center" cellpadding="2" cellspacing="0" class="tabp">
<tr>
<td class="tdp">
第2頁
</td>
</tr>
<tr>
<td class="tdp">
模式對話框下打印可能會報腳本錯誤“對象不支持此屬性或方法”,如果想做類似的可以用open開一個網頁是可以的,
或者在模式對話框中嵌一個iframe里面引用打印頁(后一種方法我沒有實際測試,有興趣的人自行研究,順便把結果告訴我...)
</td>
</tr>
<tr>
<td class="tdp">
&nbsp;
</td>
</tr>
<tr>
<td class="tdp">
&nbsp;
</td>
</tr>
</table>
<hr align="center" width="90%" size="1" noshade class="hr">
<div class="PageNext"></div>
<table width="90%" border="0" align="center" cellpadding="2" cellspacing="0" class="tabp">
<tr>
<td class="tdp">
第3頁
</td>
</tr>
<tr>
<td class="tdp">
打印預覽中,你會看到最下方有顯示分頁的地方,你可以預覽自己的設置是否成功
</td>
</tr>
<tr>
<td class="tdp">
&nbsp;
</td>
</tr>
<tr>
<td class="tdp">
&nbsp;
</td>
</tr>
<tr>
<td class="tdp">
</td>
</tr>
</table>
</body>
</html>

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM