body { height: 3000px; 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; } /* 资料卡 */ .info { width: 450px; height: 350px; background-color: rgba(255, 255, 255, 0.5); position: absolute; top: 170px; left: 140px; text-align: justify; } .info button { width: 50px; height: 30px; border-style: none; border-radius: 2px; color: white; background-color: rgb(255, 183, 124); outline: none; position: absolute; top: 30px; left: 360px; } .info button: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(139, 139, 139, 0.8); } .info button:active { background-color: rgba(255, 183, 124, 0.781); } .info h3 { padding: 0 0 25px 0 ; margin: 0; } .info span { position: relative; left: 20px; padding: 10px 70px 10px 0; } .info span#idCard { margin-left: -15px; } .info span#roomName { margin-left: -15px; } .info table { margin-left:13px; } .info td { padding: 2px 5px 2px 5px; } /* 房间实况 */ .room { width: 450px; height: 350px; background-color: rgba(255, 255, 255, 0.5); position: absolute; top: 170px; left: 660px; } .room h2 { padding: 0 0 0 20px; color: rgb(255, 206, 166); } /* 本周步数 */ .walk { width: 450px; height: 350px; background-color: rgba(255, 255, 255, 0.5); position: absolute; top: 580px; left: 140px; } /* 睡眠情况 */ .sleep { width: 450px; height: 350px; background-color: rgba(255, 255, 255, 0.5); position: absolute; top: 580px; left: 660px; } /* 心率 */ .heart { width: 450px; height: 350px; background-color: rgba(255, 255, 255, 0.5); position: absolute; top: 980px; left: 140px; } /* 血压 */ .blood { width: 450px; height: 350px; background-color: rgba(255, 255, 255, 0.5); position: absolute; top: 980px; left: 660px; } /* 行动轨迹 */ .track { width: 1150px; height:550px; background-color: rgba(255, 255, 255, 0.5); position: absolute; top: 1380px; left: 55px; } /* 无数据替换样式 */ .noData { background-image: url("images/哭.png"); opacity: 0.5; background-size: cover; background-repeat: no-repeat; }