Login function interface production

Login interface front-end:

        
  
  
 
 
 
 
 
     
 
登录
 
账号注册
 
 
  

这个是CSS文件 .mar_auto { margin-right: auto; margin-left: auto; } .re { position: relative; } .mt70 { margin-top: 70px; } .min_h400 { min-height: 400px; } .w432 { width: 432px; } .btn_1 { display: inline-block; line-height: 16px; padding: 15px 0; margin-bottom: 30px; border-radius: 3px; font-family: Microsoft YaHei,SimHei; background: #03a9f4; border: 1px solid #0398db; color: #fff; font-size: 20px; text-align: center; cursor: pointer; } .w430 { width: 430px; } .pf_ipt_user, .pf_ipt_pass, .pf_ipt_verify{ height: 20px; line-height: 20px; padding: 13px 20px; margin-bottom: 30px; width: 390px; border: 1px solid #d9d9d9; border-radius: 3px; color: #888; font-size: 16px; font-family: Microsoft YaHei,SimHei; } .w230{ width: 230px; }

Example analysis:

Because when actually making a page, there will be more page styles, so putting CSS styles and HTML code together will result in code page comparison It is long and very inconvenient, so I will write the CSS style in a separate page.

This code is to reference the CSS style into the HTML page for use, otherwise CSS styles will not work.

It should be noted that when referencing CSS style files, you must pay attention to the location of the file. If the CSS file and HTML file are not at the same level, you need to pay attention to the reference method. /folder/.../CSS files, level-by-level references.

The next step is the page layout, which can be made according to your own preferences or customer needs. In this way, the front-end login page is ready.