CSS を使用して特定の Div 要素のみを印刷するにはどうすればよいですか?

特定のコンテンツの印刷: 分離

他のページ要素を除外しながら特定のコンテンツを印刷ジョブに組み込むのは面倒な場合があります。これに対処するために、CSS は指定された

のみを印刷できるソリューションを提供します。

解決策:

次の CSS コードは、ターゲット

を効果的に分離します。印刷用:

@media print {
  body {
    visibility: hidden;
  }
  #printarea {
    visibility: visible;
    position: absolute;
    left: 0;
    top: 0;
  }
}

説明:

このコードは、印刷メディア クエリを使用して、印刷時にドキュメントにスタイルを選択的に適用します。

CSS のみのソリューションの利点:

• ウィンドウ操作や追加のコードが不要です。
• を除く、ページ上のすべての要素が非表示になります。 >
印刷物のレイアウトを維持します
.
不必要な印刷プレビューの不便さを回避します。

代替アプローチ:

CSS は洗練されたソリューションを提供しますが、代替手段がありますアプローチ:

• 表示操作:
これには、印刷不可能な要素に対して display:none を設定することが含まれます。ただし、ページのレイアウトが崩れる可能性があり、構造の変更が必要になります。
• 表示制御:
CSS のみのソリューションに似ていますが、要素の正確な配置は必要ありません。

CSS のみのアプローチは、レイアウトやユーザー エクスペリエンスを損なうことなく、特定のコンテンツを印刷するための簡単で効果的なソリューションを提供します。

以上がCSS を使用して特定の Div 要素のみを印刷するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。