html css显示隐藏菜单栏,html – 全部隐藏,用css显示一个类

上下文：使可打印的发票在浏览器中生成.

在使可打印网页使用@media打印规则来改变内容查找打印页面的方式时,这种情况很常见.理想情况下,因为我只打印页面的一小部分,所以我想隐藏所有内容然后显示特定元素的内容.

结构是这样的：

...lots of elements...

...lots more...

...some tools...

...some elements I want to print...

...more stuff I don't want to print...

我试过的东西：

理想情况下,我想做点什么

body * {

display: none;

}

.printing, .printing * { /* Both parts are needed to make it display */

display: block !important;

}

但这不起作用,因为有些元素需要内联,有些需要阻塞.我已经玩了一些不同的值来显示从MDN,并找不到一个容易将值重置为其原始值. display：initial似乎被视为内联.

当然,有可能明确地“隐藏”我不想要打印的东西,而不是显示我想要的东西,但在我看来应该可以走另一条路.

我注意到w3 draft和the display-outside page似乎建议使用未知(to webkit)box-suppress属性来保留显示值而不显示元素.

我的问题：

什么是隐藏所有内容并定位某些元素的最佳方式,当它们不共享显示属性时？

box-suppress究竟做了什么？