media 是指定 CSS 套用裝置
預設(不指定時)是螢幕
例如
<link rel="stylesheet" type"text/css" href="print.css" media="print">
這代表這一份 CSS 只有在列印時才會生效
你也可這麼寫
<style type="text/css">
@media print {
.....
.....
.....
}
CSS3列印解決許多問題,如@media print可對列印頁面做不同的CSS顯示樣子,設定邊框與頁輸出列印的紙張大小調用,都可以很客製化的去製作所需要的呈現的列印頁面,並且想讓某段落分到下一個頁面,也可用pag-break-after:always;,強制分頁。
CSS
@page {
margin:1cm; /*print邊界*/
size:210mm148mm; /*列印紙張大小*/
}
.print {
page-break-after:always; /*print分頁面*/
}
@media print{
.imgs{
width:100px;
}
}
HTML
<div class="print">
要印的內容
</div>