.meun { width: 240px; height: 100%; position: fixed; z-index: 999; border-right: 1px solid #e6e6e8; box-sizing: border-box; } .meun .logo { width: 146px; height: 36px; margin: 0 auto; display: block; margin-top: 18px; margin-bottom: 34px; } .meun ul { padding: 0 28px; } .meun ul li { height: 40px; line-height: 40px; margin-bottom: 8px; } .meun ul .active { background: #f7f7f7; border-radius: 3px; } .meun ul li a{} .meun ul li a img { vertical-align: text-top; margin-left: 4.5px; margin-top: -18px; } .meun ul li a span { font-size: 16px; color: #111622; } .header { position: fixed; width: calc(100% - 240px); height: 64px; left: 240px; z-index: 999; border-bottom: 1px solid #e6e6e8; background: #fff; box-sizing: border-box; } .header .search{ width: 440px; height: 36px; background-color: #f7f7f7; border: 1px solid #e6e6e8; border-radius: 3px; box-sizing: border-box; margin: 14px 0 0 32px; } .header .search input { background: #0000; height: 100%; padding-left: 17px; width: 343px; box-sizing: border-box; } .header .search .but{ position: relative; height: 100%; width: 75px; padding-left: 20px; line-height: 34px; } .header .search .but::before { content: " "; position: absolute; width: 1px; height: 16px; background-color: #e6e6e6; top: 50%; left: 0; margin-top: -8px; } .header .search .but span { font-size: 16px; color: #666; } .header .login{ width: 611px; } .header .login .menu_two { line-height: 64px; } .header .login .menu_two li { float: left; margin-right: 16px; padding-right: 10px; font-size: 14px; color: #111622; } } .header .login .menu_two li a{} .header .login .menu_two li a i {} .header .login .menu_two li a span { /* font-size: 14px; color: #111622; */ } .header .login .log_reg { margin-top: 14px; } .header .login .log_reg li:first-child { border: 1px solid #e6e6e8; height: 30px; border-radius: 5px; padding: 0 8px; } .header .login .log_reg li:last-child { padding:0 26px; height: 30px; background-color: #ff2626; border-radius: 5px; color: #fff; } .header .login .log_reg li { float: left; line-height: 32px; margin-right: 24px; font-size: 14px; color: #111622; } .header .login .log_reg li i {} .header .login .log_reg li span {} .content { width: calc(100% - 240px); padding: 32px 0 0 32px; height: 100%; background-color: #fafafa; margin-left: 240px; padding-top: 64px; box-sizing: border-box; } .content .first{ } .content .first img { width: 600px; height: 266.26px; border-radius: 3px; } .content li{ float: left; padding-right: 16px; margin-top: 44px; } .content li .dingwei{ position: relative; } .content li .dingwei img { width: 292px; height: 164px; margin-bottom: 17px; border-radius: 3px; } .content li .dingwei .zhibo { width: 36px; height: 20px; line-height: 20px; background: red; color: #fff; font-size: 12px; border-radius: 10px; position: absolute; left: 12px; top: 12px; padding: 0 12px 0 22px; background-image: url(https://pic.rmb.bdstatic.com/baidu-rmb-video-cover-1/2022-5/1652689008111/9557bd3b37a1.gif); background-size: 12px 12px; background-repeat: no-repeat; background-position: 6px; } .content li .dingwei .shuzhi { font-size: 14px; color: #fff; text-align: right; line-height: 30px; box-sizing: border-box; padding: 0 12px; position: absolute; bottom: 12px; right: 12px; height: 30px; width: 100%; } .content li .cont_b{ width: 292px; } .content li .cont_b img{ width: 36px; height: 36px; border-radius: 100%; float: left; } .content li .cont_b .tietle{ font-size: 16px; color: #111622; line-height: 22px; font-weight: 500; } .content li .cont_b .name, .content li .cont_b .bofang{ font-size: 14px; color: #505666; line-height: 22px; font-weight: 400; margin-left: 39px; }