html+css3+jquery登录弹框

    
    
    
    


点击我出现弹框

    

    

        

            
登录
            
        
        

            

                

                    
                    
                
                

                    
                    
                
            
            

                

                    
                    记住密码
                
                

                    忘记密码
                
            
        
        

            取消
            登陆
        
    

此篇文章总结：

1.借用Font Awesome实现输入框图标的显示。

2.自定义了checked样式。        

 

也可使用背景实现input输入框图标的改变，感兴趣的朋友可以试试。
        .popcon input{
            background: #f9f9f9 url("images/tx.jpg") left center no-repeat;
        }
        .popcon input:focus{
            background: #FFFFff url("images/txa.jpg") left center no-repeat;
        }
        .popcon input:nth-child(2){
            background: #f9f9f9 url("images/ys.jpg") left center no-repeat;
        }
        .popcon input:nth-child(2):focus{
            background: #FFFFff url("images/ysa.jpg") left center no-repeat;
        }

代码效果展示如下：