Webエンジニア向けプログラミング解説動画をYouTubeで配信中!
▶ チャンネル登録はこちら

【CSS Modules】print-color-adjustプロパティの使い方

print-color-adjustプロパティの使い方について、初心者にもわかりやすく解説します。

作成日: 更新日:

基本的な使い方

print-color-adjustプロパティは、ウェブページを印刷する際に、要素に設定された背景色や背景画像がどのように表示されるかを制御するプロパティです。

通常、ウェブブラウザは、印刷時のインク消費を抑えたり、印刷物の視認性を向上させたりするために、ページの印刷時に要素の背景色や背景画像を省略したり、簡略化して表示したりすることがあります。このプロパティを使用すると、そうしたブラウザのデフォルトの動作を調整し、背景の表示方法を開発者が明示的に指定できます。

このプロパティには主に二つの値があります。一つは economy で、これが初期値として設定されています。economy を指定すると、ブラウザはインク消費量を抑えるために、背景色や画像を印刷しないか、簡略化して印刷する場合があります。もう一つは exact で、これを指定すると、ブラウザは要素に設定された背景色や画像を、可能な限り忠実に印刷するように試みます。

例えば、ウェブサイトのデザインにおいて、背景色が重要な情報伝達の一部を担っている場合や、特定の背景画像が必須である場合に print-color-adjust: exact; を設定することで、意図した通りの印刷結果を得やすくなります。ただし、exact を指定すると、印刷時のインク消費量が増える可能性がある点にご留意ください。このプロパティは、印刷物の品質を向上させたい場合に有効活用できます。

公式リファレンス: print-color-adjust

構文(syntax)

1print-color-adjust: economy;

引数(parameters)

引数なし

引数はありません

戻り値(return)

戻り値なし

戻り値はありません

関連コンテンツ

関連プログラミング言語