body { height: 880px; /* background-color: papayawhip; */ margin: 0px; background-image: url("images/天空1.jpg"); background-repeat: no-repeat; background-size: cover; } /* LOGO */ .box1 { text-align: left; position: absolute; top: 30px; left: 10px; user-select: none; -moz-user-select: none; -ms-user-select: none; -webkit-user-select: none; } .upper { color: rgb(255, 115, 0); font-weight: bolder; font-family: sans-serif; font-size: 45px; letter-spacing: -10px; } .lower { color: rgb(255, 183, 124); font-family: sans-serif; font-size: 45px; letter-spacing: -5px; } /* 横向菜单栏 */ .menu { width: auto; height: 50px; background-color: rgb(255, 183, 124); margin-top: 100px; } ul { width: auto; list-style-type: none; white-space: nowrap; padding: 0; } .menu li { float: left; } .menu li#self { margin: 0 0 0 979px; } .menu li a { color: white; text-decoration-line: none; display: block; padding: 14px 40px 15px 70px; } .menu li a:hover { background-color: rgba(248, 148, 66, 0.7); } .menu ul li a#firstPage { background-image: url("icons/首页.png"); background-repeat: no-repeat; background-size: 12%; background-position: 35px 16px; } .menu ul li a#my { background-image: url("icons/管理员.png"); background-repeat: no-repeat; background-size: 12%; background-position: 35px 16px; } /* 头像及账号资料 */ .background { width: 700px; height: 200px; background-color: white; margin: 50px 0 0 280px; position: absolute; border-radius: 2px; } .background .pic { width: 128px; height: 128px; position: relative; top: 36px; left: 30px; /* background-color: yellow; */ } .background .pic a { background-image: url("icons/管理员头像.png"); background-repeat: no-repeat; background-size: 100%; border-radius: 2px; display: block; padding: 64px; } .background .backgroundText { width: 200px; height: auto; position: relative; top: -100px; left: 308px; /* background-color: yellow; */ } .background .logout input { width: 90px; height: 30px; border-style: none; border-radius: 2px; color: white; background-color: red; outline: none; position: relative; top: -135px; left: 550px; } .background .logout input:hover { transform: translate(0,-1px); -ms-transform: translate(0,-1px); -webkit-transform: translate(0,-1px); -o-transform: translate(0,-1px); -moz-transform: translate(0,-1px); box-shadow: 3px 3px 3px rgba(192, 192, 192, 0.801); } .background .logout input:active { background-color: rgba(255, 55, 55, 0.781); } .background:hover { transform: translate(0,-1px); -ms-transform: translate(0,-1px); -webkit-transform: translate(0,-1px); -o-transform: translate(0,-1px); -moz-transform: translate(0,-1px); box-shadow: 10px 10px 5px rgba(90, 90, 90, 0.3); } /* 消息块 */ .messages { width: 400px; height: auto; background-color: white; position: absolute; top: 420px; left: 280px; } .messages:hover { transform: translate(0,-1px); -ms-transform: translate(0,-1px); -webkit-transform: translate(0,-1px); -o-transform: translate(0,-1px); -moz-transform: translate(0,-1px); box-shadow: 10px 10px 5px rgb(90, 90, 90, 0.3); } .messages h2 { /* background-color: yellow; */ padding: 0 0 0 20px; } .messages div { width: 180px; height: 140px; border-top: 1px rgb(224, 224, 224) solid; float: left; margin: 5px 5px 10px 12px; color: black; /* background: linear-gradient(left,rgb(248, 235, 233),rgba(245, 239, 230, 0.897)); background: -webkit-linear-gradient(left,rgb(248, 235, 233),rgba(245, 239, 230, 0.897)); background: -o-linear-gradient(left,rgb(248, 235, 233),rgba(245, 239, 230, 0.897)); background: -moz-linear-gradient(left,rgb(248, 235, 233),rgba(245, 239, 230, 0.897)); */ } .messages div h5 { margin: 2px 0 0 0; padding: 0 0 0 10px; /* background-color: yellow; */ } .messages div p { width: 170px; height: 105px; padding: 0 0 0 10px; /* background-color: rgb(255, 183, 124); */ } /* 修改密码 */ .modify { width: 280px; height: 383px; background-color: white; position: absolute; top: 420px; left: 700px; } .modify:hover { transform: translate(0,-1px); -ms-transform: translate(0,-1px); -webkit-transform: translate(0,-1px); -o-transform: translate(0,-1px); -moz-transform: translate(0,-1px); box-shadow: 10px 10px 5px rgb(90, 90, 90, 0.3); } .modify h2 { padding: 0 0 0 20px; } .modify form input { position: relative; top: 25px; left: 40px; border: 1px rgb(224, 224, 224) solid; border-radius: 25px; text-align: center; outline: none; font-size: 16px; } .modify form input#new { margin-top: 30px; } .modify form input#submit { margin-top: 20px; margin-left: 80px; width: 40px; height: 40px; color: white; background-color: rgb(255, 115, 0); border: none; } .modify form input#submit:hover { transform: translate(0,-1px); -ms-transform: translate(0,-1px); -webkit-transform: translate(0,-1px); -o-transform: translate(0,-1px); -moz-transform: translate(0,-1px); box-shadow: 3px 3px 3px rgba(192, 192, 192, 0.801); } .modify form input#submit:active { background-color: rgba(255, 115, 0, 0.3); }