2012-01-06 9 views
2

印刷機能を実行しています。私が得ている問題は、印刷されているページがCSSの書式設定を保持していないということです。私はCSSを使わないで普通のテキストを印刷しています。誰もがどのようにCSSの書式設定を変更せずにページを印刷するかを知っていますか?すべてのCSS書式とともにページを印刷する方法

答えて

3

ほとんどの場合、印刷しようとしているサイトに印刷用のカスタムスタイルシートがあります。このスタイルシートはしばしば単純化され、印刷可能なページに収まるように作られています。私はあなたが印刷CSSファイルを変更または削除する能力を持っていない限り、あなたができることはたくさんあるとは思わない。

Intro to print style sheets

1のマークアップの例。

<link rel="stylesheet" type="text/css" media="print" href="print.css" /> 

おそらく、プログラムでスタイルシートを削除するためにjavascriptを使用する方法がありますが、わかりません。まだ迷っている、あなたは次のようにリンクのマークアップで「メディアは= 『画面』」を持っているCSSスタイルシートを持つことができます誰のための簡単な言葉で

+0

どういうことですか?印刷媒体にprint.cssという別のスタイルシートを作成する必要がありますか?印刷用に別のスタイルシートを作成するのではなく、他の方法はありませんか? –

+0

私はサイトがすべてのCSSをデフォルトで印刷していると言っています。 CSSで印刷していない場合、そのページには既に印刷CSSシートがあります(またはおそらくスタイルが通過しないように '@ media =" screen "'が定義されています)。ブラウザが存在する可能性がある別のブラウザから印刷しようとすることでテストすることができます。問題のサイトへのリンクを提供する場合は、あなたに確信を持たせることができます。 – mrtsherman

2

<link id="Link1" href="../Styles/MainStyleSheet.css" rel="Stylesheet" type="text/css" runat="server" media="screen" /> 

これはに見られるどのようなスタイルになりますブラウザ画面。次のように

また、リンクのマークアップでのメディア= 『印刷』 'を持つ別のCSSスタイルシートを持つことができます。

<link rel="stylesheet" href="../Styles/print_voucher.css" type="text/css" media="print" /> 

これは、ユーザーが/ときにそれを印刷プレビューを表示すると見られているどのようなスタイルになります用紙に印刷されます。あなたのprint_voucher.cssファイルに

.inprintdisabled 
{ 
display: none; 
} 

はあなたのような何かを置く場合。どこでもあなたのHTMLコード内

<div class="inprintdisabled"> 

は、それがブラウザウィンドウでそのdiv要素の内容が表示されますが、/それは、印刷プレビューウィンドウに表示されて印刷されませんがある場合。

同様に、あなたのHTMLコードに

.inprintOnly 
{ 
display:none; 
} 
あなたMainStyleSheetで

<div class="inprintOnly"> 

を置けば、あなたは上に表示されていないオブジェクト(テキスト、画像など)を持つことができ、あなたのブラウザの画面に表示されますが、印刷プレビュー/印刷時に表示されます。

これが役に立ちます。

関連する問題