<pre>: عنصر PRE
آخر تحديث: 2026-10-13
<pre>عنصر PRE
نص منسق مسبقًا يحافظ على المسافات وفواصل الأسطر بخط أحادي المسافة؛ مثالي للكود أو الشعر.
| الفئة | محتوى النص |
|---|---|
| نموذج المحتوى | محتوى تدفقي |
| العناصر الأم المسموحة | أي عنصر يقبل المحتوى التدفقي |
| وسم الإغلاق | نعم — يتطلب إغلاق </pre> وسم |
| الحالة | قياسي |
📝 البنية
<pre>يحافظ على
المسافات البادئة و
فواصل الأسطر</pre>
▶ مثال
عدّل الكود أدناه وشاهد النتيجة المباشرة في الملعب:
🌐 دعم المتصفح
| المتصفح | |||||
|---|---|---|---|---|---|
| <pre> | ✓ v1 | ✓ v12 | ✓ v1 | ✓ v1 | ✓ v1 |
| مدعوم في جميع المتصفحات الرئيسية | |||||
نصيحة: تُعرض المسافات داخل pre كما هي — تجنب المسافات البادئة الإضافية؛ غالبًا ما يُقرن بـ code.
❓ الأسئلة الشائعة
Qهل تُحفظ فواصل الأسطر والمسافات داخل pre؟
Aنعم، وهذه الوظيفة الجوهرية لـ
<pre>: المسافات وفواصل الأسطر والمسافات البادئة في المصدر تظهر كما هي (يطبّق المتصفح عليه white-space: pre افتراضيًا). ولذلك انتبه في مصدر HTML الخاص بـ pre إلى كتابة المحتوى فور وسم الفتح حتى لا تدخل المسافات البادئة في العرض.Qهل يُستحسن استخدام pre مع code معًا؟
Aالتركيب مستحسن:
<pre><code>الشيفرة</code></pre> — فالـ pre يتولى حفظ التنسيق والـ code يتولى إعلان دلالة «هذا كود». وعرض pre وحده ينجح لكن قارئ الشاشة وزواحف البحث لن يعرفا أن المحتوى شيفرة.Qالشيفرة داخل pre طويلة وتفيض، ما الحل؟
Aاضبط التمرير الأفقي بـ CSS:
pre { overflow-x: auto; } — قيّد عرض الحاوية فيظهر شريط التمرير. وتجنب white-space: pre-wrap لإجبار اللف — فكسر الشيفرة في منتصفها يضر القراءة، والتمرير هو المعالجة الأصدق.🏷️ وسوم ذات صلة
💡 حالات ذات صلة
المزيد من الحالات قادمة قريبًا — ترقبوا.