转换结束时应用CSS属性

前端之家收集整理的这篇文章主要介绍了转换结束时应用CSS属性前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
CSS3转换结束之后,如何将声明的属性应用于元素?我有这样的东西:
.something {
  background: blue;
  padding: 10px 0px;
  background-clip: content-Box;
  transition: Box-shadow 300ms;
}
.something:hover {
  Box-shadow: 0px 0px 3px blue;
  padding: 0px;
  margin: 10px 0px;
}

我希望在300ms内完成转换后应用:hover声明中的填充和边距属性.

解决方法

您可以添加如下延迟:
transition: Box-shadow 300ms;

transition: padding 300ms 400ms;

第一个将在悬停和最后300ms开始,第二个将在400ms后再次启动300ms.

DEMO

Article on CSS-Tricks

原文链接:https://www.f2er.com/css/216877.html

猜你在找的CSS相关文章