خاصية text-indent
آخر تحديث: 2026-09-13
text-indent خاصية text-indent
تحدد خاصية text-indent في CSS الإزاحة الأفقية للسطر الأول من عنصر على مستوى الكتلة، وتُستخدم غالبًا لإزاحة السطر الأول من الفقرة. تؤثر فقط على السطر الأول. يمكن أن تكون القيم طولًا ثابتًا (مثل 2em) أو نسبة مئوية من عرض الكتلة الحاوية، وتنشئ القيم السالبة إزاحة معلّقة.
| الفئة | |
|---|---|
| القيمة الأولية | 0 |
| موروث | نعم |
| ينطبق على | block |
| نوع الحركة | length |
| إصدار CSS | CSS1 |
| الحالة | قياسي |
📝 التركيب
text-indent: <length> | <percentage>;
⚙️ القيم
| القيمة | النوع | الوصف |
|---|---|---|
<length> | النوع | إزاحة ثابتة للسطر الأول |
<percentage> | النوع | نسبة مئوية من عرض الكتلة الحاوية |
▶ مثال
عدّل الكود أدناه وشاهد النتيجة المباشرة في الملعب:
🌐 دعم المتصفحات
| المتصفح | |||||
|---|---|---|---|---|---|
| text-indent | ✓ v1 | ✓ v12 | ✓ v1 | ✓ v1 | ✓ v1 |
| مدعوم في جميع المتصفحات الرئيسية | |||||
تلميح: في التنضيد الصيني، يُعد 2em المعيار لإزاحة السطر الأول بمقدار حرفين؛ وتتغير الوحدة em تلقائيًا مع حجم الخط.
تحذير: يُطبَّق text-indent فقط على العناصر على مستوى الكتلة؛ ولا تُزاح العناصر المضمّنة مثل span.
❓ الأسئلة الشائعة
Qبالنسبة لأي عرض تُحسب النسبة المئوية لـ text-indent؟
Aهو نسبة إلى عرض المحتوى للكتلة الحاوية للعنصر (الأب)، وليس عرضه الخاص أو حجم خطه. فمثلًا مع أب عرضه 400px، تُزاح السطر الأول بمقدار 40px عند text-indent: 10%. أما الوحدة em فهي نسبة إلى حجم خط العنصر الحالي.
Qهل يمكنني دمج text-indent مع تقنيات إزاحة أخرى؟
Aنعم. يؤثر text-indent فقط على السطر الأول، لذا يؤدي اقترانه بـpadding-left إلى إزاحة الفقرة بالكامل؛ ودمج قيمة سالبة مع padding-left ينشئ إزاحة معلّقة حيث يبرز السطر الأول إلى اليسار. والتقنيتان لا تتعارضان.
Qكيف أُزاح السطر الأول من الفقرة بمقدار حرفين؟
Aالقاعدة القياسية في التنضيد الصيني هي text-indent: 2em. بما أن em نسبة إلى حجم الخط الحالي، فإن الإزاحة تتبع الحجم تلقائيًا وتساوي دائمًا عرض حرفين. تجنّب القيم الثابتة بـpx التي تفقد تناسبها عند تغيّر حجم الخط.