.ring_center { position: absolute; left: 0; top: 0; right: 0; bottom: 0; align-items: center; justify-content: center; display: flex; flex-direction: column; } .badge { width: 16px; height: 16px; border-radius: 8px; background-color: red; position: absolute; right: 20px; top: 10px; } .log_row { display: flex; flex-direction: row; align-items: center; justify-content: space-between; width: 652px; padding-bottom: 20px; margin-bottom: 20px; border-bottom: solid 2px #99999966; } .fast_log_btn { display: flex; height: 88px; border-radius: 44px; padding: 0 52px; align-items: center; justify-content: center; background-color: rgba(2, 182, 253, 0.2); color: #02B6FD; position: relative; } .fast_log_btn_disable { background-color: rgba(202, 202, 202, 0.2); color: #CACACA; } .fast_log_eat_btn { color: #FE810C; background-color: rgba(254, 129, 12, 0.2); } .schedule { display: flex; flex-direction: column; } .schedule_name { color: #CACACA; font-size: 24px; } .schedule_time { color: #818080; font-weight: bold; font-size: 40px; } .sticky { // position: sticky; width: 750px; height: 50px; background-color: red; top: 200px; left: 0; } .scroll-view { height: 100vh; // 使 ScrollView 填满整个视口 } .content {} .sticky-view { // position: -webkit-sticky; /* Safari */ // position: sticky; top: 0; background-color: white; padding: 10px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); z-index: 10; // 确保在其他内容之上 } .switch_btn { margin-top: 20px; margin-bottom: 20px; width: 72px; height: 72px; border-radius: 36px; display: flex; align-items: center; justify-content: center; box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.3); } .tabs{ display: flex; flex-direction: row; align-items: center; justify-content: center; width: 750px; } .tab_item { width: 72px; height: 72px; border-radius: 36px; align-items: center; justify-content: center; }