Widget:Sora.js

<style> .sora_sora_skill_bg_att{ filter:brightness(30%); mix-blend-mode:soft-light; } .sora_head_screen_5 img{ filter:invert(1); } /* 移动端适配 */ @media screen and (max-width: 768px) { .sora_sora_layout_1 { flex-direction: column; }

.sora_sora_artwork, .sora_sora_info_box { width: 100%; }

.sora_sora_info { padding: 20px; font-size: 14px; }

.sora_sora_info_name { font-size: 28px; width: 100%; }

.sora_sora_info_name p:first-child { font-size: 22px; }

.sora_sora_info_cv p { width: 60%; font-size: 14px; }

.sora_sora_info_brief { width: 100%; margin-bottom: 15px; }

.sora_sora_artwork_name_box { width: 80%; font-size: 16px; }

.sora_sora_artwork_name_bg { font-size: 16px; }

.sora_sora_artwork_content { width: 90%; }

.sora_sora_artwork_attr_box { flex-wrap: wrap; justify-content: center; font-size: 14px; }

.sora_sora_artwork_attr_box div { margin: 5px; padding: 0 8px; height: 35px; line-height: 35px; }

.sora_sora_attr_box { width: 90%; margin: 20px auto; }

.sora_sora_skill_box { margin: 20px auto; width: 95%; }

.sora_sora_skill_wrap { flex-direction: column; align-items: center; }

.sora_sora_skill_content_wrap, .sora_sora_skill_txt_box { width: 100%; margin: 10px 0; }

.sora_sora_skill_container { width: 70px; height: 70px; }

.sora_sora_skill_name_box { width: 100%; margin-left: 5px; }

.sora_sora_skill_att { width: 100px; font-size: 12px; line-height: 25px; }

.sora_sora_skill_att_name { width: 90px; height: 25px; line-height: 25px; font-size: 12px; }

.sora_sora_skill_attack_box { margin: 5px 0; }

.sora_sora_skill_attack_box img { left:-6px; top:-6px; transform:scale(0.8); }

.sora_sora_skill_attack_box p { padding: 0 30px; font-size: 16px; }

.sora_sora_attr_content img { width: 25px; height: 25px; }

.sora_sora_attr_content_txt { height: 25px; line-height: 25px; font-size: 14px; width:93%; }

.sora_sora_layout_2 { margin: 20px 0; }

.sora_sora_layout_3 { margin: 20px 0; }

.sora_sora_info_content { font-size: 14px; line-height: 1.5; }

.sora_sora_skill_txt_content { padding: 15px; font-size: 14px; line-height: 1.5; }

/* 简化复杂的变形效果 */ .sora_sora_artwork_name_box { transform: none; left: 0; }

.sora_sora_artwork_name_bg { transform: none; left: 0; }

/* 优化标题样式 */ .sora_sora_attr_title, .sora_sora_skill_title { font-size: 16px; text-align: center; clip-path: none; border-radius: 10px 10px 0 0; }

/* 确保内容不会超出屏幕 */

• {

max-width: 100%; box-sizing: border-box; } }

/* 超小屏幕适配 */ @media screen and (max-width: 480px) { .sora_sora_info { padding: 15px; font-size: 12px; }

.sora_sora_info_name { font-size: 24px; }

.sora_sora_info_name p:first-child { font-size: 18px; }

.sora_sora_artwork_attr_box { font-size: 12px; }

.sora_sora_artwork_attr_box div { height: 30px; line-height: 30px; padding: 0 5px; }

.sora_sora_skill_container { width: 60px; height: 60px; }

.sora_sora_skill_att { width: 80px; font-size: 10px; line-height: 20px; }

.sora_sora_skill_att_name { width: 70px; height: 20px; line-height: 20px; font-size: 10px; } } </style>