* { padding: 0; margin: 0; box-sizing: border-box; } @font-face { font-family: "DIN"; src: url("../font/DIN-Medium.otf") format("truetype"); } html, body { height: 13.5rem; width: 100vw; } .wrap { height: 13.5rem; width: 100vw; background-image: url('../imags/bj.jpg'); } html::-webkit-scrollbar{ display: none; } .y_image_default { background-position: center; background-repeat: no-repeat; background-size: 100% 100%; } .y_row { display: flex; flex-direction: row; } .y_column { display: flex; flex-direction: column; } .y_action1 { background: #00FFFF !important; color: #010E3B !important; } /* 头部样式 */ .y_head { width: 100vw; overflow: hidden; padding: 0 .25rem; display: flex; flex-direction: column; } .y_head>.y_logo { width: 100%; height: .725rem; } .y_logo { background-image: url(../imags/01.png); } .y_logo>div { flex: 1; } .y_title { color: #00FFFF; font-size: .375rem; text-align: center; } .y_navbars { align-items: center; cursor: pointer; } .y_navbars > .y_navbar { /* width: .85rem; height: .275rem; */ padding: 0.02rem 0.135rem; border-radius: .25rem .25rem .25rem .25rem; border: .0125rem solid #63CAFF; color: #63CAFF; font-size: .15rem; /* line-height: .275rem; */ text-align: center; margin-right: .125rem; } .y_setting { justify-content: flex-end; align-items: flex-end; } .y_set { /* width: .35rem; height: .175rem; */ padding-left: .275rem; font-size: .175rem; font-family: Alibaba PuHuiTi 2.0-55 Regular, Alibaba PuHuiTi 20; font-weight: normal; color: #63CAFF; background-position: left center; background-size: .175rem .175rem; margin-left: .25rem; } .mine { background-image: url(../imags/02.png); } .set { background-image: url(../imags/03.png); } .help { background-image: url(../imags/04.png); } .exit { background-image: url(../imags/05.png); } .full { background-image: url(../imags/06.png); } .y_navs { justify-content: center; } .y_navs>.y_nav { width: 1.2rem; height: .425rem; background: #072761; line-height: .425rem; text-align: center; color: #00FFFF; background-image: url(../imags/07.png); margin: .1875rem .25rem; } /* 内容部分 */ .y_body { height: calc(100% - 1.525rem); width: 100vw; } .y_body>.site { width: 7.3375rem; height: 100%; justify-content: space-between; } .y_body>.site:nth-child(1) { padding: 0 .2375rem .25rem .25rem; } .y_body>.site:nth-child(2) { width: calc(100% - 14.675rem); padding-bottom: .25rem; } .y_body>.site:nth-child(3) { padding: 0 .25rem .25rem .2375rem; } .y_box { width: 6.85rem; height: 3.7rem; border: 1px solid red; background: rgba(14, 22, 95, 0.3); box-shadow: inset 0px 0px 4px 0px rgba(12, 81, 149, 0.5); border: 1px solid #1B538B; } .y_box_label{ height: .35rem; background-image: url(../imags/09.png); background-size: 2.55rem; text-align: center; line-height: .35rem; font-size: .175rem; color: #ffffff; position: relative; } .y_box_main{ width: 100%; height: calc(100% - .35rem); padding: 0 .25rem; } .y_more{ position: absolute; top: .125rem; right: .125rem; color: #63CAFF; font-size: .15rem; line-height: .15rem; } .swiper-box{ height: calc(100% - 3.7rem); width: 100%; padding-top: .375rem; } .swiper { width: 100%; height: 80%; background-color: #ffffff; } .swiper-slide>img{ height: 100%; width: 100%; }