完整代码|一个简易的静态引导页-1

时间:9个月前   阅读:828
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta http-equiv="Pragma" content="no-cache">
  <meta http-equiv="Cache-Control" content="no-cache">
  <meta http-equiv="Expires" content="0">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0" />
<title>测试</title>
<meta name="keywords" content="测试">
<meta name="description" content="测试!">


<style> 
.login-bg{
    /*background: #eeeeee url() 0 0 no-repeat;*/
     background:url(http://img.zshao.vip/2021/12/10/43a3387505aa010.png) no-repeat center;
    background-size: cover;
    overflow: hidden;
}


@media (max-width: 768px) {
	.login-logo img{
		width:250px;
	}
}

.login{
    margin: 40px auto 0 auto;
    min-height: 420px;
    max-width: 740px;
    padding: 40px;
    background-color: #ffffff;
    margin-left: auto;
    margin-right: auto;
    border-radius: 16px;
    /* overflow-x: hidden; */
    box-sizing: border-box;
}

.login .message {
   
   text-align:center;
	   font-weight: bold;
	   margin-bottom: 20px;
    position: relative;
    color: #D007EE;
    font-size: 26px;
}
.login .content {
	   font-weight: bold;
     color: #D007EE;
    font-size: 18px;
}

.content p{text-indent: 2em} 

.login input[type=text],
.login input[type=file],
.login input[type=password],
.login a, select {
    border: 1px solid #DCDEE0;
    vertical-align: middle;
    border-radius: 3px;
    height: 50px;
    padding: 0px 16px;
    font-size: 14px;
    color: #555555;
    outline:none;
    width:100%;
    box-sizing: border-box;
}
.login input[type=text]:focus,
.login input[type=file]:focus,
.login input[type=password]:focus,
.login input[type=email]:focus, select:focus {
    border: 1px solid #27A9E3;
}

.login a{
    display: inline-block;
    vertical-align: middle;
    padding: 12px 24px;
    margin-right: 20px;
    font-size: 18px;
    line-height: 24px;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
    color: #ffffff;
   text-decoration: none;
    border-radius: 3px;
    border: none;
    -webkit-appearance: none;
    outline:none;
    width:100%;
	  border-radius: 8px;
}
.login hr {
    background: #fff url() 0 0 no-repeat;
}
.login hr.hr15 {
    height: 15px;
    border: none;
    margin: 0px;
    padding: 0px;
    width: 100%;
}
.login hr.hr20 {
    height: 20px;
    border: none;
    margin: 0px;
    padding: 0px;
    width: 100%;
}

</style> 
</head>
<body class="61b2b3aca8dd9 login-bg">
     <div class="61b2b3aca8dfb login-logo" style="text-align:center"><img src="http://img.zshao.vip/2021/12/10/7e6fcf231694110.png"/></div>
    <div class="61b2b3aca8dff login layui-anim layui-anim-up">
        <div class="61b2b3aca8e01 message">测试</div>
       
          
                        <hr class="hr15">
            <p style="text-align:center">
			<a  href="/" target="_blank" style="background-color: #0794EE;width:40%;">测试</a>
           
			</p>
            <p style="text-align:center">
            <a  href="/faka/hpjy.html" target="_blank" style="background-color: #D007EE;width:40%;">测试</a>
			
            <a  href="/faka/wzry.html" target="_blank" style="background-color: #07EE9F;width:40%;">测试</a>
			</p>
            <hr class=" hr20" >
     <div class="61b2b3aca8e07 content">
			<p>测试。</p>
       </div>
    </div>




</body>
</html>

图片可能会不显示,自己替换一下就好了

完整代码|一个简易的静态引导页-1

上一篇:js代码|整个页面加载完后,在执行指定加载的文件

下一篇:完整代码|一个完整的静态引导页-2

网友评论

欣欣辅助网