可见性:隐藏的反面是可见性:可见。同样地,是否有相反的显示:没有?
当一个元素有display: none时,许多人都搞不清楚如何显示它,因为它不像使用visibility属性那么清楚。
我可以只使用visibility: hidden而不是display: none,但它不会产生相同的效果,所以我不会使用它。
可见性:隐藏的反面是可见性:可见。同样地,是否有相反的显示:没有?
当一个元素有display: none时,许多人都搞不清楚如何显示它,因为它不像使用visibility属性那么清楚。
我可以只使用visibility: hidden而不是display: none,但它不会产生相同的效果,所以我不会使用它。
当前回答
恢复到原来的状态put:
display=""
其他回答
visibility:hidden将隐藏元素,但元素是他们的DOM。在display:none的情况下,它会从DOM中移除元素。
你可以为元素选择hide或unhide。但是一旦你删除它(我的意思是不显示),它就没有明确的相反值。Display有几个值,如Display:block, Display:inline, Display:inline-block和许多其他值。你可以从W3C找到它。
在打印机友好的样式表的情况下,我使用以下:
/* 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: 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中添加/删除这个类名。
我使用 显示:块; 这对我很有用