Css3页面板块加载渐进动画

只需要引入类名就可以了：

从事职业：
前端开发工程师

css样式：

  /* 放大进入 */
  .loadScale{
    animation: loading1 1s;
  }
  @keyframes loading1
  {
  	from {transform: scale(0.8, 0.8);opacity: 0.4;}
  	to {transform: scale(1, 1);opacity: 1;}
  }
  /* 左渐进 */
  .leftEntry{
    animation: loading2 1s;
  }
  @keyframes loading2
  {
  	from {transform: translateX(-180px);opacity: 0.6;}
  	to {transform: translateX(0px);opacity: 1;}
  }
  /* 右渐进 */
  .rightEntry{
    animation: loading3 1s;
  }
  @keyframes loading3
  {
  	from {transform: translateX(180px);opacity: 0.6;}
  	to {transform: translateX(0px);opacity: 1;}
  }
  /* 上渐进 */
  .topEntry{
    animation: loading4 1s;
  }
  @keyframes loading4
  {
  	from {transform: translateY(-180px);opacity: 0.6;}
  	to {transform: translateY(0px);opacity: 1;}
  }
  /* 下渐进 */
  .bottomEntry{
    animation: loading5 1s;
  }
  @keyframes loading5
  {
  	from {transform: translateY(180px);opacity: 0.6;}
  	to {transform: translateY(0px);opacity: 1;}
  }