/* Print Stylesheet */
@media print {
/* Page Setup */
@page {
size: A4 portrait;
margin: 2cm 2cm 2cm 2cm;
}
/* First Page (optional different margins) */
@page :first {
margin-top: 2cm;
}
/* Left/Right Pages for double-sided printing */
@page :left {
margin-left: 2cm;
}
@page :right {
margin-right: 2cm;
}
/* Base Typography */
body {
font-family: Georgia, Times, serif;
font-size: 12pt;
line-height: 1.5;
color: #000000;
background: white !important;
}
h1, h2, h3, h4, h5, h6 {
font-family: Helvetica, Arial, sans-serif;
page-break-after: avoid;
break-after: avoid;
}
/* Hide Non-Print Elements */
nav,
footer,
.sidebar,
.ads,
.no-print {
display: none !important;
}
/* Remove Backgrounds */
* {
background: transparent !important;
box-shadow: none !important;
text-shadow: none !important;
}
/* Link Styling */
a {
color: #000000;
text-decoration: underline;
}
/* Show URLs after links */
a[href^="http"]::after,
a[href^="https"]::after {
content: " (" attr(href) ")";
font-size: 0.8em;
font-weight: normal;
word-wrap: break-word;
}
/* Don't show URLs for internal/anchor links */
a[href^="#"]::after,
a[href^="javascript"]::after {
content: "";
}
/* Expand Abbreviations */
abbr[title]::after {
content: " (" attr(title) ")";
}
/* Image Handling */
img {
max-width: 100% !important;
page-break-inside: avoid;
break-inside: avoid;
}
/* Avoid Page Breaks Inside */
figure,
table,
blockquote,
pre {
page-break-inside: avoid;
break-inside: avoid;
}
/* Force Page Break After */
h1 {
page-break-after: always;
break-after: page;
}
/* Orphans and Widows */
p, blockquote {
orphans: 3;
widows: 3;
}
/* Table Handling */
table {
border-collapse: collapse;
width: 100%;
}
thead {
display: table-header-group;
}
tr {
page-break-inside: avoid;
break-inside: avoid;
}
th, td {
border: 1px solid #000;
padding: 0.5em;
}
/* Page Numbers (experimental - limited support) */
@page {
@bottom-center {
content: counter(page);
}
}
}/* Complete Print Stylesheet Example */
/* ==========================================================================
Print Styles
========================================================================== */
@media print {
/* -------------------------------------------------------------------------
Page Setup
------------------------------------------------------------------------- */
@page {
size: A4 portrait;
margin: 2cm;
}
@page :first {
margin-top: 3cm;
}
@page :left {
margin-left: 2.5cm;
margin-right: 2cm;
}
@page :right {
margin-left: 2cm;
margin-right: 2.5cm;
}
/* -------------------------------------------------------------------------
Reset & Base Styles
------------------------------------------------------------------------- */
*,
*::before,
*::after {
background: transparent !important;
color: #000 !important;
box-shadow: none !important;
text-shadow: none !important;
}
body {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 12pt;
line-height: 1.5;
margin: 0;
padding: 0;
}
/* -------------------------------------------------------------------------
Typography
------------------------------------------------------------------------- */
h1, h2, h3, h4, h5, h6 {
font-family: Helvetica, Arial, sans-serif;
font-weight: bold;
page-break-after: avoid;
break-after: avoid;
margin-top: 1.5em;
}
h1 { font-size: 24pt; }
h2 { font-size: 18pt; }
h3 { font-size: 14pt; }
h4 { font-size: 12pt; }
p {
orphans: 3;
widows: 3;
margin: 1em 0;
}
/* -------------------------------------------------------------------------
Links
------------------------------------------------------------------------- */
a {
text-decoration: underline;
}
a[href^="http"]::after,
a[href^="https"]::after {
content: " (" attr(href) ")";
font-size: 0.8em;
word-wrap: break-word;
}
/* Skip internal links and javascript */
a[href^="#"]::after,
a[href^="javascript:"]::after {
content: "";
}
/* -------------------------------------------------------------------------
Abbreviations
------------------------------------------------------------------------- */
abbr[title]::after {
content: " (" attr(title) ")";
}
/* -------------------------------------------------------------------------
Images
------------------------------------------------------------------------- */
img {
max-width: 100% !important;
height: auto !important;
page-break-inside: avoid;
break-inside: avoid;
}
figure {
page-break-inside: avoid;
break-inside: avoid;
margin: 1em 0;
}
figcaption {
font-size: 0.9em;
font-style: italic;
}
/* -------------------------------------------------------------------------
Tables
------------------------------------------------------------------------- */
table {
width: 100%;
border-collapse: collapse;
page-break-inside: auto;
}
thead {
display: table-header-group;
}
tfoot {
display: table-footer-group;
}
tr {
page-break-inside: avoid;
break-inside: avoid;
}
th, td {
border: 1px solid #000;
padding: 0.5em;
text-align: left;
}
th {
font-weight: bold;
background-color: #f0f0f0 !important;
}
/* -------------------------------------------------------------------------
Code Blocks
------------------------------------------------------------------------- */
pre, code {
font-family: "Courier New", Courier, monospace;
font-size: 0.9em;
}
pre {
border: 1px solid #ccc;
padding: 1em;
page-break-inside: avoid;
break-inside: avoid;
white-space: pre-wrap;
word-wrap: break-word;
}
/* -------------------------------------------------------------------------
Blockquotes
------------------------------------------------------------------------- */
blockquote {
border-left: 4px solid #000;
margin: 1em 0;
padding-left: 1em;
page-break-inside: avoid;
break-inside: avoid;
font-style: italic;
}
/* -------------------------------------------------------------------------
Lists
------------------------------------------------------------------------- */
ul, ol {
margin: 1em 0;
padding-left: 2em;
}
li {
margin-bottom: 0.5em;
}
/* -------------------------------------------------------------------------
Page Breaks
------------------------------------------------------------------------- */
.page-break-before {
page-break-before: always;
break-before: page;
}
.page-break-after {
page-break-after: always;
break-after: page;
}
.avoid-break {
page-break-inside: avoid;
break-inside: avoid;
}
/* Section breaks */
article, section {
page-break-before: auto;
}
h1 {
page-break-before: always;
break-before: page;
}
/* -------------------------------------------------------------------------
Hide Non-Print Elements
------------------------------------------------------------------------- */
nav,
aside,
footer,
header nav,
.sidebar,
.navigation,
.menu,
.breadcrumb,
.pagination,
.social-share,
.comments,
.related-posts,
.advertisement,
.ads,
.banner,
.popup,
.modal,
.tooltip,
.dropdown,
button,
input,
select,
textarea,
[role="navigation"],
[aria-hidden="true"],
.no-print,
.print-hidden {
display: none !important;
}
/* -------------------------------------------------------------------------
Show Print-Only Elements
------------------------------------------------------------------------- */
.print-only,
.visible-print {
display: block !important;
}
/* -------------------------------------------------------------------------
Page Numbers (Limited Support)
------------------------------------------------------------------------- */
@page {
@bottom-center {
content: counter(page) " of " counter(pages);
}
}
/* -------------------------------------------------------------------------
Print Header/Footer
------------------------------------------------------------------------- */
.print-header {
position: fixed;
top: 0;
left: 0;
right: 0;
text-align: center;
font-size: 10pt;
border-bottom: 1px solid #000;
padding-bottom: 0.5em;
}
.print-footer {
position: fixed;
bottom: 0;
left: 0;
right: 0;
text-align: center;
font-size: 10pt;
border-top: 1px solid #000;
padding-top: 0.5em;
}
}
/* Screen-only styles (hidden when printing) */
@media screen {
.print-only,
.visible-print,
.print-header,
.print-footer {
display: none !important;
}
}