html{ margin: auto; } *{ z-index:20; font-family: "pingfang sc"; box-sizing: border-box; } a{ color: #333; } body { margin: auto; display: flex; flex-direction: column; justify-content: center; background-color: #fff; } .page { width: 7.5rem; margin: 0px !important; min-height: 100vh; overflow: hidden; position: relative; font-size: 0.28rem; color: #333; padding-bottom: 0.6rem; } /* 顶部背景图和文字logo */ .top_back{ padding: 0.70rem 0.24rem 0.24rem 0.24rem; display: flex; flex-direction: column; align-items: flex-start; position: relative; margin: auto; background-image: ; background-position:center center; background-size: auto 100%; min-height: 2.5rem; background-repeat: no-repeat; width: 100%; height: fit-content; } .top_back .tips{ width: fit-content; height: 0.44rem; line-height: 0.44rem; font-size: 0.22rem; color: #4587f8; border-radius: 6px; background: #fff; padding: 0px 0.14rem; margin-top: 0.18rem; margin-bottom: 0.4rem; } .top_back h1{ color: white; text-shadow: 0 4px 8px #085edf99; font-family: "microsoft yahei"; font-style: normal; font-weight: bold; line-height: normal; letter-spacing: 2.6px; font-size: 0.5rem; margin-bottom: 0; margin-top: 0; } .top_back .logo{ position: absolute; top: 0.29rem; left: 0.24rem; width: 0.88rem; height: 0.35rem; } .top_back .line_bar{ position: absolute; left: 0.24rem; bottom: 0.6rem; width: 0.96rem; height: 0.1rem; border-radius: 55px; background: linear-gradient(90deg, #9ae1fd 0%, #ffe641 100%); } .top_back .border_line{ background-color: #fff; height: 0.26rem; width: 7.5rem; position: absolute; bottom: -1px; left: 0; border-radius: 0.1rem 0.1rem 0 0 ; } /* 面包屑 */ .crumbs { font-size: 0.28rem; color: #333; padding: 0 0.24rem; padding-bottom: 0; background-color: white; } .crumbs a{ color: #333; } /* 主要内容 */ .main_content{ padding: 0.24rem; padding-bottom: 0.1rem; background-color: #fff; } /* 月历 */ .month_info_box{ margin-bottom: 0.5rem; } .month_name{ display: flex; align-items: center; font-size: 0.36rem; font-weight: bold; margin-bottom: 0.3rem; } .month_name img{ width: 0.39rem; height: 0.28rem; margin-right: 0.1rem; } .table_outer{ margin-bottom: 0.3rem; background-color: #f3f8ff; border-radius: 0.2rem; padding-bottom: 0.24rem; } .table_type_name{ border-radius: 0.2rem 0 0.2rem 0; width: fit-content; padding: 0 0.24rem; height: 0.54rem; line-height: 0.54rem; text-align: center; color: white; font-size: 0.26rem; font-weight: 600; margin-bottom: 0.1rem; } .table_type_name.type1{ background-color: #68a4f8; } .table_type_name.type2{ background-color: #6275d8; } .table_type_name.type3{ background-color: #62d883; } .table_type_name.type4{ background-color: #d86262; } .table_type_name.type5{ background-color: #ff5934; } .table_type_name.type6{ background-color: #f9a33e; } /* 我的表格 */ .my_table{ border: none; border-collapse:collapse; font-size: 0.26rem; } .my_table td{ text-align: center; } .my_table tr{ text-align: center; } .my_table tr td{ height: 0.68rem; } .my_table .table_head td{ white-space: nowrap; color: #666 ; } .my_table tr td{ border-color: #f3f8ff; /* border-color: #4572ff; */ white-space: wrap; word-break: break-all; max-width: 1.80rem; padding: 0.16rem 0.14rem; } .my_table tr td a{ color: #333; } .my_table tr .grey_td{ color: #999999; } /* 资讯 */ .news_box{ padding: 0 0.24rem 0.4rem 0.24rem; } .news_title{ display: flex; align-items: center; font-size: .36rem; font-weight: 600; margin-bottom: 0.3rem; } .news_box .news_title img{ width: 0.23rem; height: 0.34rem; margin-right: 0.20rem; } .news_box .news_list{ background-color: #f3f8ff; border-radius: 0.2rem; padding: 0.16rem 0.28rem ; } .news_box .news_list li{ padding: 0.15rem 0; display: flex; align-items: center; } .news_box .news_list li a{ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .news_box .news_list li::before{ content: ""; display: block; max-width: 0.15rem; min-width: 0.15rem; height: 0.15rem; background-color: #86b5ff; border-radius: 50%; margin-right: 0.18rem; } .city_kaoshi{ display: flex; flex-wrap: wrap; background-color: #f3f8ff; border-radius: 0.2rem; padding: 0.16rem 0.28rem ; } .city_kaoshi li{ margin-right: 0.30rem; font-size: 0.28rem; /* background-color: pink; */ padding: 0.15rem 0; width: 1.9rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .city_kaoshi li:nth-child(3n){ margin-right: 0; } .myblue{ color: #4572ff !important; } .link_button{ padding:0.05rem 0.2rem; font-size: 0.24rem; background-color: #e2eeff; border-radius: 1rem; } .nav_box{ background-color: #fff; border-radius: 0.14rem; padding: 0.24rem; padding-bottom: 0.30rem; margin: 0 0.24rem; margin-top: 0.20rem; } .nav_tilte{ font-size: 0.3rem; font-weight: 600; padding-bottom: 0.24rem; border-bottom: 1px solid #68a4f8; margin-bottom: 0.24rem; } .nav_box_outer{ /* display: flex; flex-wrap: wrap; */ } .nav_part{ width:100%; /* margin-right: 0.16rem; */ margin-bottom: 0.16rem; border-radius: 0.14rem; background-color: #f5f5f5; } .part_title{ font-size: 0.28rem; font-weight: 600; margin-bottom: 0.16rem; padding-left: 0.16rem; padding-right: 0.16rem; padding-top: 0.16rem; } .nav_part ul{ display: flex; flex-wrap: wrap; font-size: 0.24rem; padding-right: 0.16rem; } .nav_part ul li{ margin-left: 0.16rem; margin-bottom: 0.16rem; } .nav_part ul li a{ color: #444; }