/** * AHLSX 多语言排版兼容样式 * * 按语系分组： * CJK → zh（中文）：保持原有排版 * Latin → en/es/fr/vi/id/ms：左对齐、英文字体链、弹性高度 * Thai → th：左对齐、泰文字体、弹性高度 * * 此文件由 assets-functions.php 在 ahlsx-style 之后加载 * 依赖 属性做语言选择器匹配 */ /* ============================================ 3.1 font-family 多语言适配 ============================================ */ /* 泰语：加入泰文字体 */ html[lang="th-TH"] body { font-family: "Sarabun", "Noto Sans Thai", "TLWG Typo", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif; } /* ============================================ 3.2 text-align: justify 全面修复 CJK（中文）→ justify 可用 Latin + Thai → 左对齐，避免单词间距过大 ============================================ */ html:is([lang^="en"],[lang^="es"],[lang^="fr"],[lang^="vi"],[lang^="th"],[lang^="id"],[lang^="ms"]) :is(.in-about dd p, .list-4 li .text p, .about-desc, .contact-desc p, .about-list li .text p) { text-align: left !important; word-spacing: normal; letter-spacing: normal; } /* ============================================ 3.3 letter-spacing 负值修复 ============================================ */ html:is([lang^="en"],[lang^="es"],[lang^="fr"],[lang^="vi"],[lang^="th"],[lang^="id"],[lang^="ms"]) .in-about dd h4 small { letter-spacing: normal; } /* ============================================ 3.4 固定高度放宽（非中文语言） 英文翻译通常比中文长 1.5-2 倍，固定 height 会截断 改用 max-height 保留截断但放宽限制 ============================================ */ html:is([lang^="en"],[lang^="es"],[lang^="fr"],[lang^="vi"],[lang^="th"],[lang^="id"],[lang^="ms"]) .hy-menu li p { height: auto; max-height: 65px; /* 桌面端原 46px，放宽到 65px */ } html:is([lang^="en"],[lang^="es"],[lang^="fr"],[lang^="vi"],[lang^="th"],[lang^="id"],[lang^="ms"]) .list-4 li .text p { height: auto; max-height: 72px; /* 桌面端原 50px，放宽到 72px */ } html:is([lang^="en"],[lang^="es"],[lang^="fr"],[lang^="vi"],[lang^="th"],[lang^="id"],[lang^="ms"]) #marquee li p { height: auto; max-height: 72px; /* 原始 50px，放宽到 72px */ } html:is([lang^="en"],[lang^="es"],[lang^="fr"],[lang^="vi"],[lang^="th"],[lang^="id"],[lang^="ms"]) .about-list li .text p { height: auto; max-height: 200px; /* 原始 150px，放宽到 200px */ } /* 移动端覆盖 */ @media screen and (max-width: 767px) { html:is([lang^="en"],[lang^="es"],[lang^="fr"],[lang^="vi"],[lang^="th"],[lang^="id"],[lang^="ms"]) .hy-menu li p { max-height: 72px; /* 移动端原 52px，放宽到 72px */ } html:is([lang^="en"],[lang^="es"],[lang^="fr"],[lang^="vi"],[lang^="th"],[lang^="id"],[lang^="ms"]) .list-4 li .text p { max-height: 60px; /* 移动端原 42px，放宽到 60px */ } } /* ============================================ 3.5 英文长单词截断优化 nowrap + ellipsis 对英文长标题只显示一个词就被截断 改为允许 2 行显示 ============================================ */ html:is([lang^="en"],[lang^="es"],[lang^="fr"],[lang^="vi"],[lang^="th"],[lang^="id"],[lang^="ms"]) .list-4 li .text h4 { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } /* ============================================ 3.6 Impact 字体多语言兼容 Impact 是纯英文字体，对泰文/越南文数字无法显示 ============================================ */ /* 拉丁语系：用 Arial Black 替代 */ html:is([lang^="en"],[lang^="es"],[lang^="fr"],[lang^="vi"],[lang^="id"],[lang^="ms"]) :is(.header .tel strong, .tel-tl dd strong, .in-rz-tel strong, .contact-sd .tel strong, .list-4 li .date strong) { font-family: "Arial Black", "Helvetica Neue", sans-serif; } /* 泰语：用泰文字体 */ html[lang="th-TH"] .header .tel strong, html[lang="th-TH"] .tel-tl dd strong, html[lang="th-TH"] .in-rz-tel strong, html[lang="th-TH"] .contact-sd .tel strong, html[lang="th-TH"] .list-4 li .date strong { font-family: "Sarabun", "Noto Sans Thai", sans-serif; } /* ============================================ 3.7 行高微调（非中文语言） 中文 line-height: 1.8 合理，拉丁/泰语用 1.7 更紧凑 ============================================ */ html:is([lang^="en"],[lang^="es"],[lang^="fr"],[lang^="vi"],[lang^="th"],[lang^="id"],[lang^="ms"]) :is(.content-body, .in-about dd p, .about-desc, .contact-desc p) { line-height: 1.7; } /* ============================================ 3.8 Header 三栏布局防掉行（非中文语言） 英文文字比中文长，三栏总宽度超出 1200px 会掉行 缩小间距、字号，保证一行内放下 ============================================ */ html:is([lang^="en"],[lang^="es"],[lang^="fr"],[lang^="vi"],[lang^="th"],[lang^="id"],[lang^="ms"]) .header .text { margin: 20px 0 20px 15px; padding: 5px 0 5px 15px; font-size: 15px; } html:is([lang^="en"],[lang^="es"],[lang^="fr"],[lang^="vi"],[lang^="th"],[lang^="id"],[lang^="ms"]) .header .text strong { font-size: 24px; } html:is([lang^="en"],[lang^="es"],[lang^="fr"],[lang^="vi"],[lang^="th"],[lang^="id"],[lang^="ms"]) .header .tel { padding-left: 40px; background-size: auto 25px; }