你的位置:首页 > 软件开发 > 网页设计 > css3实现渐变的iPhone滑动解锁效果

css3实现渐变的iPhone滑动解锁效果

发布时间:2015-03-30 12:00:38
先贴代码<!DOCTYPE html><html><head> <style> p{ width:50%; margin:0 auto; line-height:50px; font ...

先贴代码

<!DOCTYPE html><html><head>  <style>    p{      width:50%;      margin:0 auto;      line-height:50px;       font-size:50px;       text-align:center;            -webkit-background-clip: text;  /*按文字裁剪*/          -webkit-text-fill-color: transparent;  /*文字的颜色使用背景色*/              background-color:#19385c;  /*设置一个背景色*/          background-image: -webkit-linear-gradient(-45deg, rgba(0, 0, 0, 0.6) 30%, #aff0ff 50%, rgba(0, 0, 0, 0.6) 70%);    /*设置渐变的背景,按对角线渐变*/            background-blend-mode: hard-light;  /*设置背景为混合模式下的强光模式*/      background-size: 200%;            -webkit-animation: shine 4s infinite;  /*给背景添加动画改变位置*/    }    @-webkit-keyframes shine {     from {background-position: 100%;}     to {background-position: 0;}    }  </style></head><body><p>&gt;&nbsp;Slide To Unlock</p></body></html>

原标题:css3实现渐变的iPhone滑动解锁效果

关键词:CSS

CSS
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。