*{ font: 13px/1.5 '微软雅黑', Verdana, Helvetica, Arial, sans-serif; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -box-sizing: border-box; padding:0; margin:0; list-style:none; box-sizing: border-box; } body,html{ height:100%; overflow:hidden; } body{ background:url(../img/home/bg.png) no-repeat ; background-size: cover; } .time{ position: absolute; right: 2%; font-size: 20px; letter-spacing: 2px; top: 2.5%; color: #19ECFF; } .tou{ height: 100%; width: 100%; } .centers{ display: flex; flex-direction: row; justify-content: center; align-items: center; } .head{ height:10%; width: 100%; font-size: 40px; color: #19ECFF; letter-spacing: 10px; font-weight: bold; } .main{ display: flex; height:90%; width: 100%; } .login{ height: 56%; width: 30%; } .title{ color: #ffffff; font-size: 40px; font-weight: bold; letter-spacing: 10px; } .info{ flex:2; height: 100%; background:url(../img/home/infoBg.png) no-repeat; background-size: cover; display: flex; flex-direction: column; } .one{ flex: 1; margin-top: 3%; margin-left: 10%; margin-right: 10%; color: #ffffff; letter-spacing: 2px; font-size: 18px; font-weight: bold; } .two{ margin-bottom: 2%; display: flex; flex: 2; margin-left: 10%; margin-right: 6%; } .four{ margin-bottom: 2%; display: flex; flex: 4; margin-left: 10%; margin-right: 6%; } .infoBg{ flex: 1; flex-direction: column; color: #ffffff; padding-left: 2%; padding-top: 1%; letter-spacing: 1px; font-size: 16px; display: flex; } .cursor{ background-image: url(../img/home/cursor.png); background-size: cover; background-repeat: no-repeat; background-position: center center; /* 可选,用于居中背景图 */ } .board{ background:url(../img/home/board.png); background-size: cover; background-repeat: no-repeat; background-position: center center; /* 可选,用于居中背景图 */ } .blue{ color: #01E2DE; font-size: 21px; font-weight: bold } .green{ color: #5CFEA7; font-size: 21px; font-weight: bold } .red{ color: #FF5C52; font-size: 21px; font-weight: bold } .yellow{ color: #FEDB65; font-size: 21px; font-weight: bold } .ash{ color: #C2C6D0; } .ass{ color: #40B284; } .ye{ color: #D3B95E; } .resource{ flex:3; height: 100%; display: flex; flex-direction: column; } .greens{ height: 35px; width: 35px; background:url(../img/home/green.png); background-repeat: no-repeat; background-position: center center; /* 可选,用于居中背景图 */ } .blues{ height: 35px; width: 35px; background:url(../img/home/blue.png); background-repeat: no-repeat; background-position: center center; /* 可选,用于居中背景图 */ } .yellows{ height: 35px; width: 35px; background:url(../img/home/yellow.png); background-repeat: no-repeat; background-position: center center; /* 可选,用于居中背景图 */ } .text{ flex: 1; color: #C3C5CF; } .textFont{ color: #00FFF4; font-size: 18px; font-weight: bold; } .textFonts{ color: #FEDB65; font-size: 18px; font-weight: bold; } a.logo{ display: block; height: 58px; width: 167px; margin: 0 auto 30px auto; background-size: 167px 42px; } .message { margin: 1% 0 0 0; text-align: center; color: #fff; font-size: 30px; letter-spacing: 3px; font-family: "Helvetica Neue", Helvetica, "PingFang SC", 微软雅黑, Tahoma, Arial, sans-serif; font-weight: 600; } #login-form{ margin-top: 15%; width: 70%; margin-left: 15%; } .input-container{ position: relative; } .icon { position: absolute; top: 16px; left: 10px; width: 20px; height: 20px; } .photo{ background-image: url("../img/login/phone.png"); } .pwd{ background-image: url("../img/login/pwd.png"); } .code{ background-image: url("../img/login/code.png"); } .refresh{ position: absolute; top: 20px; right: -20px; width: 25px; height: 25px; background-image: url("../img/login/refresh.png"); } ::-webkit-input-placeholder{ /*Webkit browsers*/ color:#9FA6B4; font-size:16px; } ::-moz-placeholder{ /*Mozilla Firefox 4 to 8*/ color:#9FA6B4; font-size:16px; } ::-moz-placeholder{ /*Mozilla Firefox 19+*/ color:#9FA6B4; font-size:16px; } ::-ms-input-placeholder{ /*Internet Explorer 10+*/ color:#9FA6B4; font-size:16px; } input[type=text], input[type=file], input[type=password], input[type=email], select { border: 1px solid #2AA0E6; vertical-align: middle; border-radius: 3px; height: 50px; padding: 0px 35px; font-size: 14px; color: #ffffff; outline:none; width:100%; background-color: transparent; } input[type=text]:focus, input[type=file]:focus, input[type=password]:focus, input[type=email]:focus, select:focus { border: 1px solid #27A9E3; } input[type=submit], button{ display: inline-block; vertical-align: middle; padding: 12px 24px; margin: 0px; font-size: 18px; line-height: 24px; text-align: center; white-space: nowrap; vertical-align: middle; cursor: pointer; color: #ffffff; background-color: #189F92; border-radius: 3px; border: none; -webkit-appearance: none; outline:none; width:100%; } hr.hr15 { height: 15px; border: none; margin: 0px; padding: 0px; width: 100%; } hr.hr20 { height: 20px; border: none; margin: 0px; padding: 0px; width: 100%; } .copyright{ font-size:14px; color:rgba(255,255,255,0.85); display:block; position:absolute; bottom:15px; right:15px; }