1.创建一个registe.css文件,里面存放界面的设置,包含大小字体颜色等

* {

margin: 0;

padding: 0;

list-style-type: none;

}

.reg-content{

padding: 30px;

margin: 3px;

}

a, img {

border: 0;

}

body{

background-image: url("../imgs/R-C.jpg");

text-align: center;

}

table{

border-collapse: collapse;

border-spacing: 0;

}

td,th{

padding: 0;

height: 90px;

}

.inputs{

vertical-align: top;

}

.clear{

clear: both;

}

.clear:before,.clear after{

content: "";

display: table;

}

.clear:after{

claer:both;

}

.form-div {

background-color: rgba(255, 255, 255, 0.27);

border-radius: 10px;

border: 1px solid #aaa;

width: 424px;

margin-top: 150px;

margin-left:1050px;

padding: 30px 0 20px 0px;

font-size: 16px;

box-shadow: inset 0px 0px 10px rgba(255, 255, 255, 0.5), 0px 0px 15px rgba(75, 75, 75, 0.3);

text-align: left;

}

.form-div input[type="text"], .form-div input[type="password"], .form-div input[type="email"] {

width: 268px;

margin: 10px;

line-height: 20px;

font-size: 16px;

}

.form-div input[type="checkbox"] {

margin: 20px 0 20px 10px;

}

.form-div input[type="button"], .form-div input[type="submit"] {

margin: 10px 20px 0 0;

}

.form-div table {

margin: 0 auto;

text-align: right;

color: rgba(64, 64, 64, 1.00);

}

.form-div table img {

vertical-align: middle;

margin: 0 0 5px 0;

}

.footer {

color: rgba(64, 64, 64, 1.00);

font-size: 12px;

margin-top: 30px;

}

.form-div .buttons {

float: right;

}

input[type="text"], input[type="password"], input[type="email"] {

border-radius: 8px;

box-shadow: inset 0 2px 5px #eee;

padding: 10px;

border: 1px solid #D4D4D4;

color: #333333;

margin-top: 5px;

}

input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus {

border: 1px solid #50afeb;

outline: none;

}

input[type="button"], input[type="submit"] {

padding: 7px 15px;

background-color: #3c6db0;

text-align: center;

border-radius: 5px;

overflow: hidden;

min-width: 80px;

border: none;

color: #FFF;

box-shadow: 1px 1px 1px rgba(75, 75, 75, 0.3);

}

input[type="button"]:hover, input[type="submit"]:hover {

background-color: #5a88c8;

}

input[type="button"]:active, input[type="submit"]:active {

background-color: #5a88c8;

}

.err_msg{

color: red;

padding-right: 170px;

}

#password_err,#tel_err{

padding-right: 195px;

}

#reg_btn{

margin-right:50px; width: 285px; height: 45px; margin-top:20px;

}

 2.创建一个html文件,存放对用户名密码手机号的验证信息

欢迎注册

欢迎注册

已有帐号? 登录

用户名


密码


手机号



注意:register.css和html文件的存放位置,以及需要在imgs内放入背景图片

 

 

相关文章

评论可见,请评论后查看内容,谢谢!!!
 您阅读本篇文章共花了: