在網頁開發中,我們經常需要對頁面中的文字進行排版,此時我們就可以借助CSS樣式來實現。而對于A4紙大小的排版,CSS樣式同樣可以實現。下面我們來看一下如何使用CSS樣式實現A4紙大小的排版。
/* 設置A4紙大小 */ @media print { body { width: 21cm; height: 29.7cm; margin: 0; padding: 0; } /* 設置頁眉和頁腳 */ header, footer { position: fixed; height: 2.5cm; background-color: #fff; top: 0; border-bottom: 1px solid #000; } header { left: 0; right: 0; } footer { left: 0; right: 0; bottom: 0; } /* 設置內容區域 */ main { position: absolute; top: 2.5cm; bottom: 2.5cm; width: 100%; padding: 1.5cm; box-sizing: border-box; font-size: 14pt; line-height: 1.5; } }
通過上面的CSS樣式,我們就可以將頁面大小設置為A4紙大小,同時設置了頁眉和頁腳的高度和位置。在main區域設置了padding值,使內容不會緊貼著頁邊距。并且,我們還可以在樣式中設置字體大小和行高等屬性,以達到最佳的排版效果。
上一篇A3CSS
下一篇css td 的字體大小