假设我的网页有这样的结构:
<body>
<div id="fee">
<div id="fi">
<div id="actual_content">
<p>Content</p>
<div id="some_important_stuff">Blah</div>
<p>More content</p>
<span class="and_another_thing">Meh</span>
...
</div>
<div id="fo>
...
</div>
...
</div>
<div id="fum">
...
</div>
...
</div>
<div id="fazz">
...
</div>
...
</body>
我想创建一个打印 CSS 样式,隐藏除以下内容之外的所有内容实际内容.
我的第一次尝试是这样的:
body * {
display: none; /* Hide everything first */
}
/* Show content div and all of its ancestors */
body > #fee {
display: block;
}
body > #fee > #fi {
display: block;
}
body > #fee > #fi > #actual_content {
display: block;
}
/* Unhide contents of #actual_content */
#actual_content * {
display: block; /* Not ideal */
}
但是,由于没有“display:auto”或“display:default”,所以我弄乱了实际内容当我尝试取消隐藏它们时。我也不喜欢对路径进行硬编码实际内容因为它可能会改变。
您可能想使用能见度 http://www.w3schools.com/cssref/pr_class_visibility.asp财产。 W3学校描述 http://www.w3schools.com/css/css_display_visibility.asp显示属性和可见性属性之间的区别:可见性属性影响元素的可见性,但不影响其结构,即它通常在页面上占用的空间。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)