.scroll_out_{ position: fixed; top: 114px; bottom: 0; left: 0; right: 0; } .row{ width: 100%; background: white; border-top: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6; } .row_top{ width: 100%; height: 54px; } .row_h_r{ border-top: 1px solid #e6e6e6; width: 100%; height: 36px; } .row_h_r p{ line-height: 36px; margin: 0; text-align: center; } .row_top .img{ padding: 9px; width: 54px; height: 54px; border-radius: 50%; overflow: hidden; display: inline-block; float: left; } .row_top p{ float: left; line-height: 54px; font-size: 14.4px; color: #222222; } .row_top .btn{ width: 17px; height: 54px; padding: 22px 0; float: right; display: inline-block; margin-right: 12px; } .ani{ transform:rotate(180deg) } .nav{ position: fixed; top: 66px; left: 0; right: 0; height: 48px; background: white; } .nav .block{ float: left; width: 40%; margin: 0 5%; text-align: center; line-height: 48px; height: 48px; font-size: 14.4px; } body .nav .on{ border-bottom: 2px solid #fc2c43; color: #f02a40; } .show_share{ position:absolute; top: 15rem; left:41%; margin-top:-100px; margin-left:-100px; } .show_share img{ width:85%; } .header_img{ position:absolute; top:0.5%; left:25.9%; z-index:2; width:33.9%; /*background: #333;*/ text-align:center; } .header_img img{ border-radius:50%; } .name_info{ position:absolute; z-index:2; width:85%; height: 2rem; color:#101010; /*background: #333;*/ text-align:center; } .name_str{ font-weight:bold; font-size:1.35rem; top:21.7%; } .time_str{ font-size:1.2rem; top:27%; } .share_info{ position:absolute; z-index:2; font-size:1rem; width:8rem; height: 2rem; /*background: #333;*/ text-align:center; } .left{ left:3.5%; } .left1{ color:#0078fe; top:41%; } .left2{ color:#fe0000; top:55%; } .right{ left:41.5%; } .right1{ color:#ff8400; top:41%; } .right2{ color:#9000ff; top:55%; } .qrcode_img{ position: absolute; top: 67%; width: 35%; left:43%; transform: translateX(-50%); } .qrcode_img img{ width: 100%; }