更改CSS中的打印文本大小

我有一個包含日誌報告的HTML文件。我想以較小的文本大小打印報告。我嘗試使用下面的CSS樣式，但文本大小沒有改變。如何解決這個問題。更改CSS中的打印文本大小

<HTML> 
<HEAD> 
<TITLE>Events</TITLE> 

<STYLE type="text/css"> 
table, th, td 
{ 
    border: 1px solid #cccccc; 
    border-collapse:collapse; 
    padding: 5px; 
} 
</STYLE> 

<STYLE type="text/css" media="screen"> 
    #eventText { 
    display: block; overflow-y: auto; height: 600px; 
    width: auto; left: 0px; top: 50px; font-size: 0.25em; 
    } 
    #eventButtons { display: block; } 
</STYLE> 

<STYLE type="text/css" media="print"> 
body { margin: 0; background-image: none; font-size: 0.25em } 
    #eventText { 
    display: block; 
    overflow-y: visible; 
    height: auto; 
    margin:0; 
    font-family: geneva, arial, helvetica, sans-serif; 
    font-size: xx-small; 
     } 
     #eventButtons { display: none; } 
     </STYLE> 
</HEAD> 

<BODY> 
    <div id="eventButtons"> 
<INPUT TYPE="BUTTON" VALUE="View" onclick="javascript:loadValues();"> 
<INPUT TYPE="BUTTON" VALUE="Print" onclick="javascript:window.print();"> 
    </div> 
    <div id="eventText"> </div> 
    </BODY> 
    </HTML>

來源

2012-04-05 Riskhan

嘗試將該樣式放入頁面（不僅在打印模式下），然後使用螢火蟲或ie開發工具查看您的文本，以查看其他類是否不覆蓋該字體大小。或者只是嘗試使用'！important'，看看會發生什麼:-) – Gatekeeper 2012-04-05 10:48:52

適合我。你測試了什麼瀏覽器，你所採用的繼承字體大小是什麼？也許你最好使用「物理」字體大小，比如「5pt」或什麼的。 – 2012-04-05 10:49:51

你有其他一些風格定義或加載後，與媒體=「全部」或沒有媒體定義？ – fcalderan 2012-04-05 10:54:20

你確切的解決方案是使用@media規則CSS

您可以設置CSS改變風格的元素。當網頁嘗試打印。打印時，以下CSS將在所有DIV元素中將背景色設置爲白色。

@media print{  
    div{ 
     background-color: #FFFFFF; 
    } 
}

您可以用這種方法輕鬆設置您選擇的元素的字體，儘管您可以使用它來做更多的事情。

你可以找到更多關於@media規則here。

來源

2015-09-04 08:12:30

而不是聲明font-size:.25em使用絕對值，如font-size:xx-small。

來源

2012-04-05 10:52:33 Marcel

更改CSS中的打印文本大小

回答

相關問題