在IE10和Chrome 29中，div display:initial的效果不如预期。

Question

我想展示一个带有以下限制的div：

• 在1024像素以下自动隐藏
• 可以通过按钮在1024像素以下切换，但如果我点击除div之外的任何地方，activeDiv类应该被移除

我在CodePen上有一个虚拟示例。

所以出现了以下问题：

• 在IE10中，切换按钮不起作用（不隐藏/显示div）。我使用开发人员工具进行了检查，但没有看到display：initial的迹象。
• 在Chrome 29中，div出现在按钮旁边而不是下面。（Firefox也是一样）
  我知道div的默认显示方式是block，但这个CSS不仅适用于div标签，所以我尝试使用initial。

- Péter

---

initial 关键字在任何版本的 IE 中都不被支持。 - Adrift

哦，我不知道那个。但是那个页面声称支持“auto”，但仍然无法使用。 - Péter

Answer 1

initial并不意味着“对于给定元素的给定属性的默认值”，而是指“由规范定义的给定属性的默认值”。无论您将其应用于什么类型的元素，display的初始值都是inline，而不是block，如此处所述。而且正如已经提到的，IE不支持initial关键词。

如果要将元素显示为块，请使用display: block。如果想要以行内方式显示它，请使用display: inline。如果要使用浏览器的默认设置，请不要设置display属性。

- BoltClock

---

我认为div标签的默认显示值是块状的。如果宽度小于1024像素并且使用了activeDiv类，我会尝试覆盖'div'类（不幸的是这个名字现在我知道了）。 - Péter

是的，但这不是“initial”的意思。 - BoltClock

那么没有将原始默认值设置回去的价值吗？比如“default”之类的东西？如果我更改了默认值，就无法重置它了吗？ - Péter

很抱歉，没有。 @Péter - Alexander Presber

更多相关信息请访问 https://dev59.com/Fmsy5IYBdhLWcg3w6yUN。简而言之，新的CSS revert 关键字应该选择元素的默认值，但目前支持不够完善。 - Elias Zamaria

Answer 2

这是什么意思？

这个CSS不仅适用于div标签。

display:initial是CSS3的属性，不被IE10支持。如果没有指定继承的display规则，它会回退到display:inline。

display:block;
display:initial;

提供一个备用的display:block。

- urz0r

---

Chrome也会干扰初始设置。div出现在按钮旁边，而不是下面。在“这个CSS不仅适用于div标签”下面，我指的是div只是一个例子，打算在其他元素上使用这些类，例如默认情况下是内联的“span”。 - Péter