htm练习2 登陆页面

  学习html的第二天，学习了一下css样式表，通过使用css练习实现一个简单的登陆页面，刚开始学习很多地方都不是很完善，在使用css来控制标签的样式也是多番调试，去查询各种属性。代码也不是很完美。对于模块的布局也做得不是很好，因为还没学习到布局的内容，所以这里就用了表格来实现，希望之后学习更多之后能够完成的更好！

登陆页面.png

html部分

    
        
        
        
    
    
        

            
            


        
        

            

                

                    

                        
后台管理系统
BACKGROUND MANAGEMENT SYSTEM
                    
                    

                    

                        

                            

                            用户名: 
                            
                        
                    

                    

                        

                            

                            密 码: 
                                
                        
                    

                    

                        

                                记住密码           忘记密码？
                        
                    

                    

                        

                            
    
                            
                        
                    
                    

                    

                        

                            还没有此账号？立即注册


                        
                    

                
            
        
    

css部分

.tr1{
    height: 20%;
    text-align: center;
    background-color: #A4D3EE;
    font-size: 18px;
    font-weight: bold;
    color: white;
}

.tb1{
    width:500px;
    height:350px;
    position:absolute;
    top: 30%;
    left: 58%;
    bottom: 0px;

}

.dl{
    color: white;
    background-color: #A4D3EE;
    font-size: 20px;
    font-weight: bold;
}

.radio{
    height: 16px;
    width: 16px;
}

input {
    width: 300px;
    height: 40px;
    font-size:25px;

}


div{
    text-align: center;
}
tr{
    border-color: rgba(0,0,0,0);
}

#web_bg{
    position:fixed;
    top: 0;
    left: 0;
    width:100%;
    height:100%;
    min-width: 1000px;
    z-index:-10;
    zoom: 1;
    background-color: #fff;
    background-repeat: no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    -o-background-size: cover;
    background-position: center 0;

}