Web打印设置
一,A4紙尺寸
1,A4紙尺寸:210mm*297mm
2,A4紙的像素和分辨率
根據A4紙尺寸是210毫米×297毫米,而1英寸=2.54厘米,我們可以得出當分辨率是多少像素時,得出A4紙大小尺寸為多少毫米。如下是我們較長用到的規格尺寸:
當分辨率是72像素/英寸時,A4紙像素長寬分別是842×595;
分辨率是96像素/英寸時,A4紙的尺寸的圖像的像素是794×1123;(默認)
當分辨率是120像素/英寸時,A4紙像素長寬分別是2105×1487;
當分辨率是150像素/英寸時,A4紙像素長寬分別是1754×1240;
當分辨率是300像素/英寸時,A4紙像素長寬分別是3508×2479;
win7下屏幕DPI分辨率為96像素/英寸。所以A4紙像素尺寸一般為794*1123
二,為打印機而不是屏幕設計的樣式
/*樣式將只是應用于打印*/
@media print{
}
注* 也可通單獨的css文件,設置link的media = "print"屬性來指定此樣式專用于打印。
<link type="text/css" rel="stylesheet" href="css/print.css" media="print"/>
為你的網站重塑整個css是沒有必要的,整體而言,由打印繼承默認樣式,僅對不同的需要加以限定,為了節省打印時的碳粉,大多數瀏覽器會自動反轉顏色,為了達到最佳效果,應使色彩變化明顯:
@media print{
body{
color:#000;
background:#fff;
}
}
我們不是在創建整個網頁的截圖,只是為了展現一個設計良好,可讀性強的網站:
h1 {
color: #fff;
background: url(banner.jpg);
}
@media print {
h1 {
color: #000;
background: none;
}
nav, aside {
display: none;
}
}
為了使打印機更具效率,應只顯示主體內容,去除頁眉頁腳導航欄
@media print {
h1 {
color: #000;
background: none;
}
nav, aside {
display: none;
}
body, article {
width: 100%;
margin: 0;
padding: 0;
}
@page {
margin: 2cm;
}
}
鏈接的處理
在打印機上鏈接是看不到的,應對超鏈接進行擴展
/*在超鏈接后面添加帶<http://XXX>的完整地址*/
@media print {
article a {
font-weight: bolder;
text-decoration: none;
}
article a[href^=http]:after {
content:" <" attr(href) "> ";
}
}
三,控制打印設置選項
該@page規則允許你指定頁面的各個方面。例如,你將要指定頁面的尺寸。頁邊距,頁眉、頁腳等都是非常重要的。
@page規則--紙張大小設置
通過下面這條CSS您可以設置紙張大小,5.5英寸寬,8.5英寸高.
@page{
size:5.5in 8.5in;
}
你還可以通過別名控制紙張大小,如A4或"legal".
@page{
size:A4;
}
你還可以控制打印方向,protrait:縱向打印 ,landscape:橫向
@page {
size: A4 landscape;
}
四,控制頁面邊距
@page{
size:A4 landscape;
margin:10px;
}
http://www.cnblogs.com/dong0738/archive/2011/10/07/2200539.html
總結
- 上一篇: Enter Further Contac
- 下一篇: ERP failure: Error w