可见性:隐藏的反面是可见性:可见。同样地，是否有相反的显示:没有?
当一个元素有display: none时，许多人都搞不清楚如何显示它，因为它不像使用visibility属性那么清楚。
我可以只使用visibility: hidden而不是display: none，但它不会产生相同的效果，所以我不会使用它。
visibility:hidden将隐藏元素，但元素是他们的DOM。在display:none的情况下，它会从DOM中移除元素。
你可以为元素选择hide或unhide。但是一旦你删除它(我的意思是不显示)，它就没有明确的相反值。Display有几个值，如Display:block, Display:inline, Display:inline-block和许多其他值。你可以从W3C找到它。
Display: none不像visibility:hidden那样有字面上的相反含义。
visibility属性决定一个元素是否可见。因此，它有两种状态(可见和隐藏)，它们彼此相反。
然而，display属性决定了元素将遵循什么布局规则。对于元素如何在CSS中布局，有几种不同的规则，因此有几种不同的值(块，内联，内联块等-请参阅这里的文档)。
Display:none从页面布局中完全删除一个元素，就好像它不存在一样。
所有其他用于显示的值都使元素成为页面的一部分，因此在某种意义上，它们都与显示相反:none。
但是没有一个值是与显示直接相反的:没有——就像没有一种发型是与“秃头”相反的一样。
当在Javascript中改变元素的显示时，在很多情况下，一个合适的选项来“撤销”element.style.display = "none"的结果是element.style.display = ""。这将从样式属性中删除display声明，将display属性的实际值恢复为文档样式表中设置的值(如果没有在其他地方重新定义，则恢复为浏览器默认值)。但更可靠的方法是在CSS中有一个类
.invisible { display: none; }
并从element.className中添加/删除这个类名。
就像Paul解释的那样，没有与显示相反的文字:在HTML中没有，因为每个元素都有不同的默认显示，你也可以用类或内联样式等改变显示。
However if you use something like jQuery, their show and hide functions behave as if there was an opposite of display none. When you hide, and then show an element again, it will display in exactly the same manner it did before it was hidden. They do this by storing the old value of the display property on hiding of the element so that when you show it again it will display in the same way it did before you hid it. https://github.com/jquery/jquery/blob/740e190223d19a114d5373758127285d14d6b71e/src/css.js#L180
这意味着如果你将一个div设置为显示内联或内联块，然后隐藏它，然后再次显示它，它将再次显示为显示内联或内联块，就像之前一样
<div style="display:inline" >hello</div>
<div style="display:inline-block">hello2</div>
<div style="display:table-cell" >hello3</div>
脚本:
$('a').click(function(){
$('div').toggle();
});
请注意，即使div被隐藏(display:none)并再次显示之后，它的显示属性也将保持不变。
在打印机友好的样式表的情况下，我使用以下:
/* screen style */
.print_only { display: none; }
/* print stylesheet */
div.print_only { display: block; }
span.print_only { display: inline; }
.no_print { display: none; }
I used this when I needed to print a form containing values and the input fields were difficult to print. So I added the values wrapped in a span.print_only tag (div.print_only was used elsewhere) and then applied the .no_print class to the input fields. So on-screen you would see the input fields and when printed, only the values. If you wanted to get fancy you could use JS to update the values in the span tags when the fields were updated but that wasn't necessary in my case. Perhaps not the the most elegant solution but it worked for me!
与显示完全相反的是:没有(目前)没有。
但是display: unset非常接近，在大多数情况下都可以工作。
来自MDN (Mozilla开发者网络):
unset CSS关键字是初始关键字和继承关键字的组合。像这两个CSS范围的关键字一样，它可以应用于任何CSS属性，包括CSS简写all。如果属性从其父继承，则该关键字将属性重置为其继承值，如果不是其父继承，则将属性重置为其初始值。换句话说，它的行为类似于第一种情况下的继承关键字，而类似于第二种情况下的初始关键字。 (来源:https://developer.mozilla.org/docs/Web/CSS/unset)
还要注意display: revert目前正在开发中。详见MDN。
我在构建一个应用程序时遇到了这个挑战，我想要为某些用户隐藏一个表，而不是为其他用户隐藏。
最初，我将它设置为display:none，但后来为那些我希望看到它的用户设置了display:inline-block，但我遇到了您可能期望的格式问题(列合并或通常混乱)。
我解决这个问题的方法是先显示表，然后为那些我不想看到它的用户执行“display:none”。这样，它可以正常格式化，但在需要时消失。
这是一个横向的解决方案，但可能会帮助到某些人!
你可以使用display: block
例子:
<!DOCTYPE html>
<html>
<body>
<p id="demo">Lorem Ipsum</p>
<button type="button"
onclick="document.getElementById('demo').style.display='none'">Click Me!</button>
<button type="button"
onclick="document.getElementById('demo').style.display='block'">Click Me!</button>
</body>
</html>
Display:unset将其设置回初始值，而不是之前的“Display”值
我只是复制了之前的显示值(在我的情况下display: flex;) 再次(在display non之后)，并且它过度尝试了display:none成功
(我使用display:none来隐藏移动和小屏幕的元素)
这是一个来自未来的答案，在你问这个问题大约8年后。虽然仍然没有显示相反的值:没有，但继续读下去……还有更好的东西。
display属性重载得太厉害了，一点都不好笑。它至少有三个不同的功能。它控制:
外部显示类型(元素如何参与父流布局，例如块，内联) 内部显示类型(子元素的布局，例如flex, grid) 显示框(元素是否显示，例如contents, none)。
长期以来，这一直是现实，我们已经学会了忍受它，但一些姗姗来迟的改进(希望如此!)正在向我们走来。
Firefox现在支持display属性的双值语法(或多关键字值)，用于分隔外部和内部显示类型。例如，block现在变成了block flow, flex变成了block flex。这并不能解决一个都没有的问题，但我认为明确的关注点分离是朝着正确方向迈出的一步。
与此同时，Chromium(85+)给了我们内容可见性属性，并大张旗鼓地宣布了它。它的目标是解决一个不同的问题——加速页面加载时间，它不呈现一个元素(及其子布局)，直到它接近视口并且真正需要被看到，同时仍然可以用于“查找”搜索等。它通过给它赋值auto自动完成这个。这本身就是令人兴奋的消息，但看看它还做了什么……
The content-visibility: hidden property gives you all of the same benefits of unrendered content and cached rendering state as content-visibility: auto does off-screen. However, unlike with auto, it does not automatically start to render on-screen. This gives you more control, allowing you to hide an element's contents and later unhide them quickly. Compare it to other common ways of hiding element's contents: display: none: hides the element and destroys its rendering state. This means unhiding the element is as expensive as rendering a new element with the same contents. visibility: hidden: hides the element and keeps its rendering state. This doesn't truly remove the element from the document, as it (and it's subtree) still takes up geometric space on the page and can still be clicked on. It also updates the rendering state any time it is needed even when hidden. content-visibility: hidden, on the other hand, hides the element while preserving its rendering state, so, if there are any changes that need to happen, they only happen when the element is shown again (i.e. the content-visibility: hidden property is removed).
哇。所以这就是display:一直都不应该是——一种从布局中优雅地、完全独立于显示类型的删除元素的方法!因此，与content-visibility: hidden相反的是content-visibility: visible，但是你在auto中还有第三个非常有用的选项，它会为你做惰性渲染，加速你的初始页面加载。
唯一的坏消息是Firefox和Safari还没有采用它。但谁知道呢，当你(亲爱的开发伙伴)读到这篇文章时，情况可能已经改变了。请关注https://caniuse.com/css-content-visibility!
使用display: revert
来自https://developer.mozilla.org/en-US/docs/Web/CSS/revert上的文档
revert CSS关键字将属性的级联值从其当前值恢复为如果当前样式原点未对当前元素进行任何更改，则属性将具有的值。因此，如果属性从其父继承，则将属性重置为其继承的值，或者将属性重置为用户代理的样式表建立的默认值(如果存在用户样式，则重置为用户样式)。它可以应用于任何CSS属性，包括CSS速记属性all。
它支持所有主流浏览器- https://caniuse.com/css-revert-value
推荐文章
- 改变引导输入焦点蓝色发光
- 我如何使一个div上的滚动条只在必要时可见?
- CSS:控制项目符号和<li>之间的空格
- 调试打印样式表的建议?
- 为什么我的CSS3媒体查询不能在移动设备上工作?
- 下一个元素的CSS选择器语法是什么?
- 是否有'box-shadow-color'属性?
- 在jQuery中的CSS类更改上触发事件
- 我如何用CSS跨浏览器绘制垂直文本?
- 如何获得box-shadow在左侧和右侧
- 相对定位一个元素，而不占用文档流中的空间
- 禁用身体滚动
- 使用jQuery动画addClass/removeClass
- 在一个CSS宽度的小数点后的位置是尊重?
- 检测输入是否有文本在它使用CSS -在一个页面上，我正在访问和不控制?
