فقرات HTML
أنت تستخدم بالفعل العناوين للتسميات والأقسام. معظم النص المقروء في جسم الصفحة ينتمي إلى الفقرات. تركز هذه الجلسة على عنصر p — كيف تكتبه، وكيف يعرضه المتصفح، وكيف يختلف عن الأسطر الفارغة في المحرر.
ما هي فقرة HTML؟
فقرة HTML كتلة نص مُعلَّمة بعنصر p. تفتح بـ <p>، تكتب النص، وتغلق بـ </p>. الفقرات للجمل العادية وكتل قصيرة من محتوى الجسم، لا لعناوين الصفحة (تلك تستخدم عناوين heading).
إجابة مباشرة
غلّف كل كتلة نص في الجسم داخل وسوم p الخاصة بها. يعامل المتصفح كل p كفقرة ويضيف عادة مسافة قبلها وبعدها. الضغط على Enter مراراً في ملف HTML لا ينشئ المسافة نفسها — المتصفح يطوي المسافات البيضاء الزائدة في المصدر ما لم تستخدم العناصر الصحيحة.
فقرتان
html<p>فقرات HTML تحمل نص الجسم العادي.</p>
<p>كل فقرة كتلة محتوى مستقلة.</p>
قراءة المثال
- أول
<p>…</p>فقرة واحدة - ثاني
<p>…</p>فقرة أخرى - يعرضهما المتصفح ككتلتين منفصلتين، عادة بمسافة بينهما
- النص بين الوسوم هو المحتوى الذي يراه القرّاء
المسافة البيضاء في المصدر ليست تخطيطاً
في المحرر يمكنك الضغط على Enter ليسهل قراءة ملف HTML. هذا لا يعني أن المتصفح سيعرض تلك الأسطر الفارغة كفجوات فارغة كبيرة. لكسر فقرة حقيقي استخدم عناصر p منفصلة. لكسر سطر داخل الفكرة نفسها — مثل عنوان قصير أو سطر قصيدة — يمكنك استخدام <br> (رأيته باختصار مع العناصر).
فقرة مع كسر سطر
html<p>
مركز التعلم<br>
١٢ طريق النهر<br>
مدينة نموذج
</p>
فضّل الفقرات على حيل المسافة الفارغة
لا تكدّس وسوم <p></p> فارغة فقط لدفع المحتوى لأسفل الصفحة. لا تضع مقالاً كاملاً داخل فقرة عملاقة إن كان عدة أفكار. قسّم الأفكار إلى كتل p واضحة. لاحقاً يتحكم CSS في المسافات والخطوط؛ يجب أن يعلّم HTML بنية النص الحقيقية.
جرّب بنفسك
- افتح هيكل HTML الأساسي
- أضف
h1وفقرتين قصيرتين تحته - أضف فقرة ثالثة تستخدم
<br>لعنوان متعدد الأسطر قصير - احفظ وافتح الصفحة في المتصفح
- قارن ما تراه بأسطر المصدر الفارغة
أخطاء شائعة
- الاعتماد على أسطر فارغة في المصدر بدل وسوم
pمنفصلة - استخدام العناوين عندما تحتاج فقط جملاً عادية في الجسم
- إنشاء فقرات فارغة فقط لإضافة مسافة عمودية
- نسيان
</p>الختامي في فقرة طويلة - وضع صفحة كاملة من أفكار غير مرتبطة داخل
pواحد
ملخص
- نص الجسم ينتمي عادة إلى عنصر
p - كل فقرة يجب أن تكون كتلة
<p>…</p>مستقلة - تضيف المتصفحات عادة مسافة بين الفقرات
- مفاتيح Enter الزائدة في المصدر لا تساوي تباعد التخطيط الحقيقي
- استخدم
<br>لكسر سطر داخل الفقرة عند الحاجة - أبقِ البنية في HTML؛ حسّن المسافات لاحقاً بـ CSS
🧠 اختبر معرفتك
اختبر معرفتك
تحدى نفسك مع هذا الاختبار التفاعلي واكتشف مدى فهمك للموضوع
📝 التعليمات
- اقرأ كل سؤال بعناية
- اختر أفضل إجابة لكل سؤال
- يمكنك إعادة الاختبار عدة مرات كما تريد
- سيتم عرض تقدمك في الأعلى