javascript - CSS 样式属性留空

Question

当 CSS 属性transform为空时会发生什么，即

element.style.transform = "";

检查这个小提琴 - https://jsfiddle.net/e85odhjf/

在 javascript 部分，我将 left.style.transform="" 留在了 back() 函数中（由 onmouseout 控制），因此它使形状恢复到原始形式。

Answer 1

当您从样式属性中清除声明时，您正在删除声明的值：

应用于元素的每个属性声明都会为与该元素关联的属性贡献一个 声明值。有关详细信息，请参阅过滤声明。

此外，这是一个具有高度特异性的声明值：

每个声明都具有与其出现的样式规则相同的特异性。在此步骤中，不属于样式规则的声明（例如样式属性的内容）被认为具有高于任何选择器的特异性. 具有最高特异性的声明获胜。

因此，您要删除的值很可能是级联值：

级联值表示级联的结果：它是赢得级联 的声明值（在级联的输出中首先排序）。

在这种情况下，所有cascaded、specified、computed和used值都可能发生变化。

如果没有其他声明值，则级联的输出将是一个空列表，并且不会有级联值。然后指定的值将是默认进程的结果。

在您的情况下，由于transform不是继承属性，因此将使用其初始值。即，transform: none。这将“将形状恢复到原始形式”。