过渡速记属性的正确顺序为
transition: <property> || <duration> || <timing-function> ;
最近,我注意到在Bootstrap中,他们将
.carousel-inner
类的顺序更改为:transition: .6s ease-in-out left;
即为:
transition: <duration> || <timing-function> || <property>
实际上,无论我们如何安排这三个参数,过渡过程都完全相同。所以问题是
我们可以更改过渡速记属性中参数的顺序吗?参数的顺序真的重要吗?
最佳答案
更新
@ user31782您曾评论过,除非有持续时间和延迟,否则速记转换的顺序可能并不重要。您的推论似乎是正确的:
Just space-separate all the individual values. The order doesn't matter except when using both duration and delay, they need to be in that order.
尽管这是指动画速记,但从逻辑上讲,这也适用于过渡速记属性:animation
和transition
速记属性在功能上非常相似。
Bootstrap正在混合订单,并且仍然有效。
旧
您确定级联中没有其他过渡吗?您检查计算的样式了吗?
请注意,顺序在此属性中的各个项目中很重要:可以将时间解析的第一个值分配给过渡持续时间,将时间解析的第二个值分配给过渡延迟。
如果速记中有多个<single-transition>
,并且任何转换的<single-transition-property>
都为“ none”,则声明无效。
https://www.w3.org/TR/css3-transitions/#transition-shorthand-property
关于html - 我们可以更改过渡速记属性中参数的顺序吗?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/37084691/