zoukankan      html  css  js  c++  java
  • css3实现渐变的iPhone滑动解锁效果

    先贴代码

    <!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>
    欢迎推荐,欢迎 star
  • 相关阅读:
    利用pyautogui自动化领取dnf的在线养竹活动的竹子
    idea2019.3版本的安装
    二叉树文本分析
    表达式树的创建
    24点游戏
    二叉树
    队列操作
    HuffmanTree
    两数之和
    面向对象Python
  • 原文地址:https://www.cnblogs.com/erbingbing/p/4377217.html
Copyright © 2011-2022 走看看