渐变背景动画效果

Html Css

 从CSS3开始,动画变得非常的酷了,但是切不可过分的使用它们。下面这一技巧巧妙地的移动背景位置,使其看起来像动画一样:

 

button {

    padding: 15px;

    background-image: linear-gradient(#FC6E51, #FFF);

    background-size: auto 200%;

    background-position: 0 100%;

    transition: background-position 0.5s;

}    

button:hover {

    background-position: 0 0;

}

相关内容推荐

JQ特效之:页面向上滚动时弹出模块

页面向上滚动弹出模块这个特效比较适合资源类网站,用户来到你的网站后一般动作就算向下翻页找,找着找着发现没找到,一般会回到顶部去找导航栏之类的,这个时候就会产生一个

返回
顶部