用途
该技能用于指导希伯来语 Web 应用的从右到左（RTL）布局实现。当用户询问 RTL 布局、希伯来语文本方向、双向（bidi）文本等问题时使用。
主要能力
技能以分步指令的形式覆盖 RTL 实现的完整流程：
- 文档方向设置：在 HTML 上使用
<html lang="he" dir="rtl">，而非仅依赖 CSS。 - CSS 逻辑属性：用逻辑属性替代物理方向属性，例如
margin-inline-start替代margin-left、text-align: start替代text-align: left、inset-inline-start替代left等，使布局在 RTL 模式下自动镜像。需要方向特定规则时优先使用:dir()伪类而非[dir="rtl"]属性选择器。 - 双向文本处理：对嵌入的 LTR 内容使用
unicode-bidi: isolate与direction: ltr；对混合或未知方向内容使用unicode-bidi: plaintext；不建议对混合内容使用bidi-override。涉及电话号码、URL、邮箱、数字与日期的隔离处理，以及使用Intl.NumberFormat('he-IL', ...)和Intl.DateTimeFormat('he-IL')格式化后再隔离。希伯来日期需通过-u-ca-Unicode 扩展请求日历，如he-IL-u-ca-hebrew。表单输入需设置dir="auto"，并区分type="tel"、email、url 字段的例外情况。区分<bdi>与<bdo>的用法，并在嵌入片段上同时标注dir与lang。 - 方向性图标镜像：镜像与阅读方向相关的图标（导航箭头、返回/前进、发送箭头、轮播与分页箭头、缩进与回复箭头、表示前进的进度指示器）；不镜像徽标、勾选与关闭图标、媒体播放按钮、时钟、具有固定朝向的实物图标。镜像技术为水平翻转变换，如
.icon-directional:dir(rtl) { transform: scaleX(-1); }，Tailwind 可用rtl:-scale-x-100。 - 希伯来语排版：推荐字体栈
'Heebo', 'Assistant', 'Rubik', 'Noto Sans Hebrew', sans-serif；行高 1.7；正文保持letter-spacing: normal，但不应全局禁用字距，因为字距是希伯来语的强调手段；希伯来语无大小写，text-transform与small-caps对希伯来字母无效，但会影响同元素中的拉丁词；尼库德（元音符号）与唱诵符号需要垂直空间，行高过紧会裁切。 - 框架特定配置：Tailwind CSS（v4）优先使用逻辑属性工具类（
ms-4、me-4、ps-4、pe-4、inset-s-4、inset-e-4、rounded-s-lg、rounded-e-lg等），rtl:/ltr:变体仅用于逻辑属性无法处理的情况；部分工具类无逻辑形式（translate-x-*、origin-left/right、bg-linear-to-r/l）需配合rtl:覆盖。Next.js App Router 中在app/[locale]/layout.tsx根据 locale 设置dir，并使用next/font自托管字体。React 与 MUI 使用官方分支@mui/stylis-plugin-rtl（注意其仅提供默认导出），并在 Next.js App Router 中通过AppRouterCacheProvider传入相同选项。门户渲染的 UI（模态框、下拉、提示、通知）需在<html>设置dir并传入库自身的方向设置（如 Radix 的<DirectionProvider dir="rtl">、MUI 主题的direction: 'rtl'）。 - 常见陷阱检查：方向性图标、进度条填充方向、滑块/轮播滑动方向、表单标签对齐、面包屑分隔符方向、表格列顺序与数字/代码/日期单元格的 LTR 强制、图表 x 轴、阴影与渐变、固定与粘性元素、滚动条位置等。
- RTL 布局验证：将整个应用切换为
dir="rtl"扫描未移动的元素；用一条包含希伯来语、拉丁语、国际电话号码与货币金额的混合字符串测试所有文本界面；打开所有门户 UI；检查固定/粘性元素、图表/SVG 与表单字段；用 Playwright 在dir="rtl"与dir="ltr"下渲染同一页面并做截图差异对比。
使用方式
技能以分步指令（Step 1 至 Step 8）组织，并附带示例（如将 LTR 组件转换为 RTL）。开发者按步骤逐项应用到项目中，并在发布前按验证步骤检查。
适用场景
适用于为希伯来语用户构建或改造 Web 界面的前端开发，包括布局、文本、图标、排版、框架配置与测试验证等环节。
限制
资料未提供该技能的安装命令、收费方式、平台支持范围或效果保证等信息。