@font-face { font-family: "tttgbnumber"; src: url("../../fonts/tttgbnumber.ttf"); font-weight: normal; font-style: normal; } * { margin: 0; padding: 0; box-sizing: border-box; user-select: none; } body { font-size: 16px; width: 700px; color: #1e1f20; transform: scale(1.3); transform-origin: 0 0; } .container { width: 700px; padding: 20px 15px 10px 15px; background-color: #f5f6fb; } .head_box { border-radius: 15px; font-family: tttgbnumber; padding: 10px 20px; position: relative; box-shadow: 0 5px 10px 0 rgb(0 0 0 / 15%); display: flex; } .head_box_avatar { height: 60px; margin-right: 20px; } .head_box .id_text { color: white; font-size: 24px; } .head_box .day_text { color: white; font-size: 20px; } .head_box .genshin_logo { position: absolute; top: 15px; right: 15px; width: 97px; } .base_info { position: relative; padding-left: 10px; } .uid { font-family: tttgbnumber; } .data_box { border-radius: 15px; margin-top: 20px; margin-bottom: 20px; padding: 20px 15px 5px 15px; background: #fff; box-shadow: 0 5px 10px 0 rgb(0 0 0 / 15%); position: relative; } .tab_lable { position: absolute; top: -10px; left: -8px; background: #d4b98c; color: #fff; font-size: 14px; padding: 3px 10px; border-radius: 15px 0 15px 15px; z-index: 20; } .data_line { display: flex; justify-content: space-around; margin-bottom: 14px; } .data_line_item { width: 200px; text-align: center; /*margin: 0 20px;*/ } .num { font-family: tttgbnumber; font-size: 24px; } .data_box .lable { font-size: 14px; color: #7f858a; line-height: 1; margin-top: 3px; } #chartContainer { width: 100%; height: 300px; } #chartContainer2 { width: 100%; height: 300px; } .logo { font-size: 14px; font-family: "tttgbnumber"; text-align: center; color: #7994a7; } .small_font { font-size: 16px; }