css3 hover过渡效果

CSS3是设计师最爱的工具之一，其中的hover过渡效果更是让网页看上去更加美观和动态。以下为大家介绍其中的一些hover过渡效果。

/* 改变字体颜色 */p:hover {
      color: #F44336;
      transition: all 0.3s ease-in-out;
}
/* 改变背景颜色 */p:hover {
      background-color: #4CAF50;
      transition: all 0.3s ease-in-out;
}
/* 增加阴影效果 */p:hover {
      box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.3);
      transition: all 0.3s ease-in-out;
}
/* 改变文字大小 */p:hover {
      font-size: 26px;
      transition: all 0.3s ease-in-out;
}
/* 增加旋转效果 */p:hover {
      transform: rotate(360deg);
      transition: all 0.3s ease-in-out;
}
    

以上就是几种常见的hover过渡效果，你可以根据自己的需求随意组合，让网页更具生命力！

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！