CSS文件 login.css
body, html {
height: 100%;
margin: 0;
padding: 0;
}
html[Attributes Style] {
-webkit-locale: "zh-CN";
}
user agent stylesheet
html {
display: block;
}
head {
display: none;
}
body {
background: #f1f1f1;
min-width: 0;
color: #444;
font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
font-size: 13px;
line-height: 1.4em;
}
body {
display: block;
}
#login {
width: 320px;
padding: 8% 0 0;
margin: auto;
}
.login * {
margin: 0;
padding: 0;
}
h1 {
display: block;
-webkit-margin-before: 0.67em;
-webkit-margin-after: 0.67em;
-webkit-margin-start: 0px;
-webkit-margin-end: 0px;
}
.login h1 a {
background-image: none,url(images/wordpress-logo.svg?ver=20131107);
background-size: 84px;
background-position: center top;
background-repeat: no-repeat;
color: #444;
height: 84px;
font-size: 20px;
line-height: 1.3em;
margin: 0 auto 25px;
padding: 0;
width: 84px;
text-indent: -9999px;
outline: 0;
display: block;
}
.login form {
margin-top: 20px;
margin-left: 0;
padding: 26px 24px 46px;
background: #fff;
box-shadow: 0 1px 3px rgba(0,0,0,.13);
}
.login form, .login h1 a {
overflow: hidden;
font-weight: 400;
}
.login h1 a, form p.submit a.cancel:hover {
text-decoration: none;
}
a {
transition-property: border,background,color;
transition-duration: .05s;
transition-timing-function: ease-in-out;
}
a:-webkit-any-link {
cursor: pointer;
}
.login #pass-strength-result, .login h1, .privacy_requests .column-type {
text-align: center;
}
#login_error, .login .message, .login .success {
border-left: 4px solid #00a0d2;
padding: 12px;
margin-left: 0;
margin-bottom: 20px;
background-color: #fff;
box-shadow: 0 1px 1px 0 rgba(0,0,0,.1);
}
p {
line-height: 1.5;
}
user agent stylesheet
p {
display: block;
-webkit-margin-before: 1em;
-webkit-margin-after: 1em;
-webkit-margin-start: 0px;
-webkit-margin-end: 0px;
}
form {
display: block;
}
label {
vertical-align: middle;
}
label {
cursor: pointer;
}
.login form .input, .login form input[type=checkbox], .login input[type=text] {
background: #fbfbfb;
}
.login form .input, .login input[type=text] {
font-size: 24px;
width: 100%;
padding: 3px;
margin: 2px 6px 16px 0;
}
@media screen and (max-width: 782px)
load-styles.php…n&ver=4.9.6:10
input[type=text], input[type=search], input[type=password], input[type=email], input[type=number] {
-webkit-appearance: none;
}
input[type=text], input[type=search], input[type=radio], input[type=tel], input[type=time], input[type=url], input[type=week], input[type=password], input[type=checkbox], input[type=color], input[type=date], input[type=datetime], input[type=datetime-local], input[type=email], input[type=month], input[type=number], select, textarea {
border: 1px solid #ddd;
box-shadow: inset 0 1px 2px rgba(0,0,0,.07);
color: #32373c;
outline: 0;
transition: 50ms border-color ease-in-out;
}
@media screen and (max-width: 782px)
load-styles.php…in&ver=4.9.6:6
input[type=text], input[type=search], input[type=password], input[type=email], input[type=number] {
}
input, select, textarea {
border-radius: 0;
}
button, input, select, textarea {
font-family: inherit;
font-weight: inherit;
}
#pass-strength-result, .color-option, input, textarea {
box-sizing: border-box;
}
input, textarea, select, button {
text-rendering: auto;
letter-spacing: normal;
word-spacing: normal;
text-transform: none;
text-indent: 0px;
text-shadow: none;
display: inline-block;
text-align: start;
font: 400 13.3333px Arial;
}
input, textarea, select, button, meter, progress {
-webkit-writing-mode: horizontal-tb;
}
p {
line-height: 1.5;
}
p {
display: block;
-webkit-margin-before: 1em;
-webkit-margin-after: 1em;
-webkit-margin-start: 0px;
-webkit-margin-end: 0px;
}
.login form, .login h1 a {
overflow: hidden;
font-weight: 400;
}
.wp-core-ui .button, .wp-core-ui .button.button-large, .wp-core-ui .button.button-small, a.preview, input#publish, input#save-post {
padding: 6px 14px;
line-height: normal;
font-size: 14px;
vertical-align: middle;
height: auto;
margin-bottom: 4px;
}
.login .button-primary {
float: right;
}
.wp-core-ui .button-primary {
background: #0085ba;
border-color: #0073aa #006799 #006799;
box-shadow: 0 1px 0 #006799;
color: #fff;
text-decoration: none;
text-shadow: 0 -1px 1px #006799, 1px 0 1px #006799, 0 1px 1px #006799, -1px 0 1px #006799;
}
.wp-core-ui .button, .wp-core-ui .button-primary, .wp-core-ui .button-secondary {
display: inline-block;
margin: 0;
cursor: pointer;
border-width: 1px;
border-style: solid;
-webkit-appearance: none;
border-radius: 3px;
white-space: nowrap;
box-sizing: border-box;
}
button, input, select, textarea {
font-family: inherit;
font-weight: inherit;
}
input[type="button" i], input[type="submit" i], input[type="reset" i], input[type="file" i]::-webkit-file-upload-button, button {
align-items: flex-start;
text-align: center;
border-image: initial;
}
input[type="button" i], input[type="submit" i], input[type="reset" i] {
user-select: none;
}
input {
-webkit-rtl-ordering: logical;
}
input, textarea, select, button {
text-rendering: auto;
letter-spacing: normal;
word-spacing: normal;
text-transform: none;
text-indent: 0px;
font: 400 13.3333px Arial;
}
登录页面：
<html lang="en"> <head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>登录</title>
<link rel="stylesheet" href="/css/login.css">
</head> <body class="login login-action-login wp-core-ui locale-zh-cn">
<div id="login">
<h1>卖家管理系统后台</h1><br>
<p class="message"> ${(login_msg?if_exists)}<br></p> <form name="loginform" id="loginform" action="/user/login/addlogin" name="loginfrom" accept-charset="utf-8" method="post">
<p>
<label for="user_login">用户名<br>
<input type="text" id="user_login" aria-describedby="login_error" class="input" name="username" value="${username?if_exists}" size="20"></label>
</p>
<p>
<label for="user_pass">密码<br>
<input type="password" id="user_pass" aria-describedby="login_error" class="input" name="password" value="${password?if_exists}" size="20"></label>
</p> <p class="submit">
<input type="submit" name="wp-submit" id="wp-submit" class="button button-primary button-large" value="登录"> </p>
</form> </body>
</html>