在 * 选择器上使用转换属性？

Question

使用 *{ transition: all 0.25s linear; } 会损害性能，还是不好的做法？还有其他方法可以更好地过渡元素吗？

我正在尝试使元素平滑过渡，以便在更改媒体查询的值时不让那些元素被切断和闪烁。

Answer 1

如果您使用 *{ transition: all 0.25s linear; }，这意味着您网站中的每个元素都将具有该属性，而定位您要制作动画的元素将仅应用于该元素。例如.animate{transition: all 0.25s linear;}

如果您的问题是关于性能的，那么 *{ /* style */ } 是迄今为止最慢的。

ID 的效率最高，Universal 的效率最低：

#main-navigation {   }      /* ID (Fastest) */
body.home #page-wrap {   }  /* ID */
.main-navigation {   }      /* Class */
ul li a.current {   }       /* Class *
ul {   }                    /* Tag */
ul li a {  }                /* Tag */
* {   }                     /* Universal (Slowest) */
#content [title='home']     /* Universal */

在 * 选择器上使用转换属性？

Use transition property on * selector?

performance

css

web

responsive

front-end-optimization

在 * 选择器上使用转换 属性？

Use transition property on * selector?

performance

css

web

responsive

front-end-optimization

在 * 选择器上使用转换属性？