私はhtmlページを持っています。ヘッダー本体とフッター付き。このプリンタフレンドリーなCSSをどうすれば処理できますか？
本文には、2つのセクションのプライマリ（左）とレール（右）があります。プライマリには記事が含まれ、レールにはいくつかのモジュールが含まれています。私は記事をプライマリに印刷するだけのCSSを書こうと思っています。
私は、これら二つの特性は、print.css
で正しく動作しますが、私は#rail {表示：なし}やるとき
#header{display:none;}
#footer{display:none;}
を行っている、それは非表示にしないと私はまだ体全体を取得します。レールの内側に表示されている要素を隠すと、隠れることもあります。しかし、レールはdoesntです。
誰かが間違っているかもしれないと私に示唆することができます。
#railセクションのインラインスタイルを確認すると、display:none;が無効になることがあります。まだ表示されている場合は、display:none;の後ろに!importantを追加してください。
私はちょうどそこに推測しているが、間違って何が起こっているかを知るための最善の方法は、あなたのprint.cssを使ってページをロードすると、Firebugのまたはそれを検索することです...
印刷プレビューを行っているときにどのようにFirebugを使用しますか... –
Firebugを使用する前に、標準のものの代わりにprint.cssを使用してページをロードします。 –
私はこれを見つけましたjqueryがうまくいくようにするには、プリンタフレンドリーなバージョンで表示するフィールドを選択することができます。また、ファイルを含む、または単にいくつかのクラスを含めて、頭にCSSを追加することもできます。
function printPage(){
var w = window.open();
var headers = $("#headers").html();
var field= $("#field1").html();
var field2= $("#field2").html();
var html = "<!DOCTYPE HTML>";
html += '<html lang="en-us">';
html += '<head><style></style></head>';
html += "<body>";
//check to see if they are null so "undefined" doesnt print on the page. <br>s optional, just to give space
if(headers != null) html += headers + "<br/><br/>";
if(field != null) html += field + "<br/><br/>";
if(field2 != null) html += field2 + "<br/><br/>";
html += "</body>";
w.document.write(html);
w.window.print();
w.document.close();
};
問題を再現する公開ページがありますか？例がなければ、ルールが一致していない（たとえば、要素がidではなくクラスを使用している）か、ルールが別の「表示」ルールによって上書きされていると推測します。これは、インラインスタイル、後の '＃rail'ルール、またはより高い特定性を持つルールです。 – detaylor