d-print-block
bootstrap5.css
bootstrap5.css
@media print {
.d-print-none {
display: none !important;
}
.d-print-inline {
display: inline !important;
}
.d-print-inline-block {
display: inline-block !important;
}
.d-print-block {
display: block !important;
}
.d-print-table {
display: table !important;
}
.d-print-table-row {
display: table-row !important;
}
.d-print-table-cell {
display: table-cell !important;
}
.d-print-flex {
display: -ms-flexbox !important;
display: flex !important;
}
.d-print-inline-flex {
display: -ms-inline-flexbox !important;
display: inline-flex !important;
}
}
html bootstrap5 Sample
印刷時の表示/非表示を設定する:d-print-none
スクリーンのみ表示(印刷時のみ非表示)
印刷時のみ表示(スクリーンでは非表示)
<div class="d-print-none">スクリーンのみ表示(印刷時のみ非表示)</div>
<div class="d-none d-print-block">印刷時のみ表示(スクリーンでは非表示)</div>