使用* {transition：easy-in-out .2s all;}有什么副作用吗？

Question

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

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

这将使.button非常美观和流畅。

后来我尝试了这个：

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

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

这样做有副作用吗？

Answer 1

这有两个方面。

1. 它会在所有元素上发生，因此，将页面应用于所有元素会占用大量CPU资源。
2. 您正在将其用于所有元素上的ALL属性。宽度，高度，变换-一切。

如果页面很简单，它可能会在新的手机和台式机浏览器上很好地工作。但是，您添加到页面中的内容越多，它就会越重。而且我认为这在较旧的移动设备上会非常繁琐。