レスポンシブWebデザインの印刷について

初めまして。Webエンジニアの井上です。

印刷時のスタイルシートは、@media を 'print' にして設定します。

旧来から、以下のようなタグで印刷用のスタイルシートを指定する手法がありました。
linkタグに「media="print"」を指定するのがポイントです。

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

上記のように印刷用に別のCSSファイルを指定する方法もまだ使用できますが、メディアクエリー（「@media ...」での指定）を使用してCSSファイルの末尾に以下のように追加指定すると、同じように印刷時のみ適用されるスタイルシートの指定が可能です。

---------------------------------
@media print {
body {
width: 960px;
}
/* 印刷時に画面と変更するスタイルを定義 */
}
---------------------------------

このとき、スタイルシート読み込み用のリンクタグに「media="screen"」の指定があれば削除して下さい。
なお、現在印刷時にCSSが全く適用されていないのであれば、この指定が付いてしまっているのかもしれません。これは、「ディスプレイ上だけでこのCSSファイルを適用する」という指定です。



あと、ご質問はもしかしたら印刷用スタイルシートと幅960px以上で設定したスタイルシートを共通して指定する方法でしたでしょうか？
実は私はやった事が無いのですが、理屈としては、半角カンマで @media の条件をつなぐ事ができる筈なので、試してみて下さい。

---------------------------------
@media print, screen and (min-width: 961px) {
/* 印刷時と、961px以上のみに適用するスタイル */
}
---------------------------------

ただ、レスポンシブWebデザイン用のCSS構成は幅広をデフォルト（＝メディアクエリー無しがデフォルト）にし、スマホなどのスタイルを「max-width: 480px」...と指定していきますので、上の「min-width」の指定は構成を複雑にしてしまいます。
このため、先にご説明した2つの方法のいずれかを使用する方がすっきりしておすすめです。