CSS控制print列印樣式

2021-05-24 11:12:17 字數 516 閱讀 7198

一、新增列印樣式

1. 為螢幕顯示和列印分別準備乙個css檔案,如下所示:

用於螢幕顯示的css:

用於列印的css:

2. import方式:

3. 直接把螢幕顯示樣式和列印樣式寫在乙個css檔案中:

@media print {}

h2 {}

}@media print裡面的內容只對列印出來的內容有效,之外的內容就是螢幕顯示的樣式。

其他:建立乙個不指定**型別的樣式表通常很有用(或者利用media="all")。當你準備好定義一些特別用

於列印的規則時,可以只建立乙個單獨的樣式表,使任何在列印時看起來不好的樣式都失效。使用這種方法的乙個問題是必須確保印表機樣式實際上確實覆蓋了主樣式表。可以使用!important.

二、列印樣式注意事項:

通常來說我們不可能用印表機來進行測試,在ie瀏覽器選單欄「檔案」中有「列印預覽」,可以通過這

列印預覽來做測試。

CSS控制print列印樣式

一 新增列印樣式 1.為螢幕顯示和列印分別準備乙個css檔案,如下所示 用於螢幕顯示的css 用於列印的css 2.import方式 3.直接把螢幕顯示樣式和列印樣式寫在乙個css檔案中 media print h2 media print裡面的內容只對列印出來的內容有效,之外的內容就是螢幕顯示的樣...

css 合同列印print 水印

最近做合同模板,發現原本的新增水印的方式出現了新bug。或者說原有的那種方式,忽略了一種特殊的情況 樣式強加的列印頁 page break after always 原因分析 先附上原本的那種js動態新增水印的方式 通過js給網頁加上水印背景 能解決大部分場景的需求。但是,它卻沒法計算到強加列印頁的...

CSS控制滑鼠樣式

hand是手型 pointer也是手型,這裡推薦使用這種,因為這可以在多種瀏覽器下使用。crosshair是十字型 text是移動到文字上的那種效果 wait是等待的那種效果 default是預設效果 help是問號 e resize是向右的箭頭 ne resize是向右上的箭頭 n resize是...