html, body { width: 100%; height: 100%; margin: 0; padding: 0; float: left; background: url(../img/background.png) no-repeat; background-size: 100% 100%; } #content{ width: 19%; height: 37%; margin-top: 15.5%; margin-left: 57%; } .title{ color: #000; font-size: 30px; font-family: "微软雅黑"; font-weight: 600; letter-spacing: 10px; text-align: center; } .content{ height: 35%; margin-top: 13%; } .phoneDiv{ height: 35%; background-color: rgba(255,255,255,0.1); } .phoneDiv>div{ display: inline-block; } .phoneDiv>.title{ display: inline-block; height: 60%; width: 25px; background: url(../img/userName.png) no-repeat; background-size: 100% 100%; margin-top: 2%; margin-left: 2%; float: left; } #phoneDiv{ width: 80%; height: 100%; margin-left: 3%; float: left; } #username{ height: 95%; width: 97%; background-color: rgba(229,235,241,1); border: 0; outline: 0; float: left; color: #000; } .pwdDiv{ height: 35%; margin-top: 9%; background-color: rgba(255,255,255,0.1); } .pwdDiv>div{ display: inline-block; } .pwdDiv>.title{ display: inline-block; height: 60%; width: 25px; background: url(../img/pwd.png) no-repeat; background-size: 100% 100%; margin-top: 2%; margin-left: 2%; float: left; } #pwdDiv{ width: 80%; height: 100%; margin-left: 3%; float: left; } #password{ height: 95%; width: 97%; background-color: rgba(229,235,241,1); border: 0; outline: 0; float: left; color: #000; } .func{ height: 7%; margin-top: 4%; } .func span:last-child{ color: #00367A; font-size: 13px; font-family: '微软雅黑'; margin-left: 64%; cursor: pointer; } #login{ height: 12.5%; margin-top: 15%; background-color: #0857ba; text-align: center; line-height: 20px; color: #fff; font-family: "微软雅黑"; font-weight: 400; line-height: 41px; cursor: pointer; } #login:hover{ background-color: rgba(8,87,186,0.5); } input::-webkit-input-placeholder{ color: rgba(152,167,191,0.5); }