css - 使用 *{transition: ease-in-out .2s all;} 是否有任何副作用？

Question

我尝试将此行添加到我的 CSS 段中：

.button {transition: ease-in-out .2s all;}

它会使.button非常漂亮和光滑。

后来我尝试了这个：

* {transition: ease-in-out .2s all;}

我发现它使:hover我页面上的每个元素看起来都非常漂亮和流畅。

这样做有什么负面影响吗？

标签： css

Answer 1

这有两个方面。

1. 它发生在所有元素上，因此页面越大，CPU 就越重，只是为了将规则应用于所有元素。
2. 您将它用于所有元素的所有属性。宽度、高度、变换——一切。

当你有一个简单的页面时，它可能在新的手机和桌面浏览器上运行良好。但是你添加到页面的越多，它就会变得越重。而且我认为它在旧的移动设备上会很重。