如何在Bootstrap中默认使每个页面元素不可打印

Question

我想明确指定应该用

打印的元素

.visible-print-block
.visible-print-inline
.visible-print-inline-block

类。我不想用hidden-print覆盖所有内容，有没有办法通过微小的css努力实现这一目标？

提前谢谢！

Answer 1

.hidden-print课只会将display: none!important添加到print媒体查询中的元素中：

@media print {
    .hidden-print {
        display: none !important;
    }
}

如果您想在打印时默认隐藏所有元素，可以使用以下内容：

@media print {
    * {
        display: none !important;
    }
}

如果要排除.visible-print-*类，可以使用：

@media print {
    body *:not(.visible-print-block):not(.visible-print-inline):not(.visible-print-inline-block) {
        display: none !important;
    }
}