---
url: https://brand.okrado.com/ar/foundations/i18n-rtl/
title: اللغة والاتجاه من اليمين إلى اليسار
description: "الإنجليزية والفرنسية والعربية: خصائص CSS المنطقية، والاتجاه على الجذر، وما يجب اختباره."
kind: reference
owner: hmdmsd
updated: 2026-11-03
review_by: 2027-02-28
audience:
  - developer
  - designer
---

# اللغة والاتجاه من اليمين إلى اليسار

> الإنجليزية والفرنسية والعربية: خصائص CSS المنطقية، والاتجاه على الجذر، وما يجب اختباره.

تصدر أوكرادو بالإنجليزية والفرنسية، والعربية جاهزة. العربية تُكتب من اليمين إلى اليسار، ويجب أن تنعكس التخطيطات دون ورقة أنماط ثانية.

## القواعد

- **خصائص CSS المنطقية فقط**: `margin-inline-start` و`padding-block` و`inset-inline-end`، وفي Tailwind الأصناف `ms-` و`pe-` و`start-`. استخدام `left` و`right` عيب.
- حدّد `lang` و`dir` على `<html>`. الطبقات العائمة (الحوارات والأدراج والإشعارات) تقع خارج غلاف الصفحة، لذلك يوضع الاتجاه على الجذر.
- تُفتح الأدراج من نهاية السطر وتنعكس من اليمين إلى اليسار.
- الأيقونات التي تدل على اتجاه (الأسهم) تنعكس، والتي تدل على شيء لا تنعكس.
- الأرقام جدولية، والنص العربي يستخدم خط Readex Pro.
- النصوص تأتي من `messages/{en,fr}.json`؛ لا تركّب جملة من أجزاء.

## ما يجب اختباره

اعرض كل شاشة بالفرنسية (نصوص أطول) وبالعربية (معكوسة). ابحث عن القصّ، ونص يقع تحت أيقونة، وأي عنصر لا ينعكس.