Html登录页面的代码怎么写

本篇内容介绍了“Html登录页面的代码怎么写”的有关知识，在实际案例的操作过程中，不少人都会遇到这样的困境，接下来就让小编带领大家学习一下如何处理这些情况吧！希望大家仔细阅读，能够学有所成！

十余年的南江网站建设经验，针对设计、前端、开发、售后、文案、推广等六对一服务，响应快，48小时及时工作处理。全网营销推广的优势是能够根据用户设备显示端的尺寸不同，自动调整南江建站的显示方式，使网站能够适用不同显示终端，在浏览器中调整网站的宽度，无论在任何一种浏览器上浏览网站，都能展现优雅布局与设计，从而大程度地提升浏览体验。成都创新互联从事“南江网站设计”,“南江网站推广”以来，每个客户项目都认真落实执行。

效果：

html源码：

XML/HTML Code复制内容到剪贴板

1.   
     
     
         
         
         
     
     
         
           
   Login
     
             
                 
                 
               登录  
             
       
     
     
   

css代码：

CSS Code复制内容到剪贴板

1. html{   
       width: 100%;   
       height: 100%;   
       overflow: hidden;   
       font-style: sans-serif;   
   }   
   body{   
       width: 100%;   
       height: 100%;   
       font-family: 'Open Sans',sans-serif;   
       margin: 0;   
       background-color: #4A374A;   
   }   
   #login{   
       position: absolute;   
       top: 50%;   
       left:50%;   
       margin: -150px 0 0 -150px;   
       width: 300px;   
       height: 300px;   
   }   
   #login h2{   
       color: #fff;   
       text-shadow:0 0 10px;   
       letter-spacing: 1px;   
       text-align: center;   
   }   
   h2{   
       font-size: 2em;   
       margin: 0.67em 0;   
   }   
   input{   
       width: 278px;   
       height: 18px;   
       margin-bottom: 10px;   
       outline: none;   
       padding: 10px;   
       font-size: 13px;   
       color: #fff;   
       text-shadow:1px 1px 1px;   
       border-top: 1px solid #312E3D;   
       border-left: 1px solid #312E3D;   
       border-right: 1px solid #312E3D;   
       border-bottom: 1px solid #56536A;   
       border-radius: 4px;   
       background-color: #2D2D3F;   
   }   
   .but{   
       width: 300px;   
       min-height: 20px;   
       display: block;   
       background-color: #4a77d4;   
       border: 1px solid #3762bc;   
       color: #fff;   
       padding: 9px 14px;   
       font-size: 15px;   
       line-height: normal;   
       border-radius: 5px;   
       margin: 0;   
   }

总结：

复制代码

代码如下:

placeholder="用户名"的作用:占位符

“Html登录页面的代码怎么写”的内容就介绍到这里了，感谢大家的阅读。如果想了解更多行业相关的知识可以关注创新互联网站，小编将为大家输出更多高质量的实用文章！