javascript - CSS 样式属性留空

标签 javascript css css-cascade

<分区>


想改进这个问题吗? 通过 editing this post 添加细节并澄清问题.

关闭 7 年前

当像 transform 这样的 CSS 属性留空时会发生什么,即

element.style.transform = "";

检查这个 fiddle - https://jsfiddle.net/e85odhjf/

在javascript部分,我把left.style.transform=""留在了back()函数中(由onmouseout控制),所以它把形状恢复到原来的形式。

最佳答案

当您从样式属性中清除声明时,您将删除 declared value :

Each property declaration applied to an element contributes a declared value for that property associated with the element. See Filtering Declarations for details.

此外,这是一个申报值(value)高specificity :

Each declaration has the same specificity as the style rule it appears in. For the purpose of this step, declarations that do not belong to a style rule (such as the contents of a style attribute) are considered to have a specificity higher than any selector. The declaration with the highest specificity wins.

因此,您要删除的值很可能是 cascaded value :

The cascaded value represents the result of the cascade: it is the declared value that wins the cascade (is sorted first in the output of the cascade).

在这种情况下,所有 cascaded , specified , computedused值可能会改变。

如果没有其他声明值,级联的输出将是空列表,不会有级联值。然后指定的值将是 defaulting processes 的结果.

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

关于javascript - CSS 样式属性留空,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37258398/

上一篇:javascript - 跨浏览器测试工具,包括浏览器版本

下一篇:html - 使用 CSS 动画将搜索框移动到顶部

相关文章:

javascript - laravel如何验证动态添加的元素

javascript - 无法使用 jenkins 作业发布 node.js 包

javascript - 向上滚动时背景图像不变,但向下滚动时工作正常

php - Bootstrap 4 导航栏固定在内容上方

javascript - easeljs sprite 使用多个图像进行动画

javascript - Javascript 中包含特定符号或单词的过滤数组

html - CSS 显示所有 child

html - 比 !important 更重要(更高级别的 !important)?

css - 我是否正确地子类化了我的 CSS?

css - 从不同文件加载时,是什么决定了两个元素之间的 CSS 顺序为 "specified"?