我知道t2会从页面中删除元素，而display: none会隐藏元素，但会保留空间。
我的问题是，在元素上一起使用这两种样式是一个好主意吗？如果是这样，两者在一起使用时的优先顺序是什么？
我的用例是这样的：
visibility: hidden时，无论如何
shouldRemoveElement = true应该从页面中删除div。
当shouldHideElement时，div应该尊重
基于shouldRemoveElement = false值的visibility样式。
虽然这可以按预期工作，但我想知道它是否会引起任何意外的副作用。
示例代码：
shouldHideElement答案 0 :(得分：1)
将display: none与visibility: hidden一起使用没有意外的副作用，如果这就是您所要求的。由于display: none会从布局中删除元素的框，因此无论您将其设置为什么值，visibility都不会产生任何影响，因为没有任何内容可以显示或隐藏。
通过从display更改其none属性确实将元素返回到布局后，当时visibility的任何值都将恢复生效，该元素将继续通过现在生成的框来影响其周围的布局。
答案 1 :(得分：0)
首先，根本没有优先级。两者都用于不同的情况。您无法相互覆盖，display: none无法使用visibility: visible覆盖。
实际答案存在于你的问题中（“我知道显示：none从页面中删除元素，而visibility：hidden隐藏元素但保留空间”）。
display和visibility两者都用于不同目的只有共同特征是从用户眼睛隐藏元素但都保持元素在DOM结构中。因此，在这两种情况下，您都可以从DOM树中将元素作为对象进行访问。这就是为什么我们不能说display: none删除元素。
我们可以使用opacity: 0通过其他方式隐藏元素，但与display和visibility的区别是mouse events {}} {} 1}}让我们有机会应用所有opacity假设mouse events，hover，mousedown，mouseup等。
答案 2 :(得分：0)
最后写的CSS将适用，除非它被定义为!important，display和visibility是两个不同的CSS属性，你不能优先考虑它们