12 – الفقرات
– النصوص – المستوى الاول
📌 الفقرات <p> في HTML
🔹 ما هو وسم <p>؟
-
<p> اختصار لكلمة Paragraph (فقرة).
-
يُستخدم لعرض النصوص في شكل فقرات منفصلة.
-
المتصفح تلقائيًا بيضيف مسافة (فراغ) قبل وبعد كل فقرة علشان النصوص ما تلزقش في بعض.
🔹 تركيب الفقرة
-
يبدأ الوسم بـ <p> وينتهي بـ </p>.
-
أي نص أو عناصر داخل الوسم ده هتعتبر فقرة.
🔹 خصائص الفقرات
-
تنسيق تلقائي: كل فقرة تبدأ في سطر جديد وبها فراغ بينها وبين الفقرة اللي بعدها.
-
محتوى نصي أساسي: بيُستخدم للفقرات النصية الطويلة أو القصيرة.
-
قابل للتنسيق بـ CSS: تقدر تتحكم في اللون، الخط، المسافة، المحاذاة… إلخ.
🔹 أمثلة على الفقرات
1. فقرتين نص عادي:
🔎 النتيجة: الفقرتين يظهروا تحت بعض وبينهم فراغ.
2. فقرة مع محاذاة (بـ CSS):
3. فقرة ملونة:
4. فقرة بخط مختلف وحجم مخصص:
🔹 استخدام <br> داخل الفقرة
-
الوسم <br> يعمل كسر سطر بدون بدء فقرة جديدة.
-
مثال:
🔹 مقارنة بين <p> و <div>
-
<p> مخصص للفقرات النصية فقط.
-
<div> يستخدم كحاوية عامة لتجميع عناصر (مش شرط نص).
مثال:
🔹 الأخطاء الشائعة
❌ لا تضع فقرة داخل فقرة:
✅ الصحيح:
🔹 مثال عملي كامل
-
<p> = فقرة نصية.
-
يبدأ بسطر جديد افتراضيًا ويترك مسافة بين الفقرات.
-
يمكن تنسيقه باستخدام CSS (ألوان، محاذاة، حجم خط…).
-
لا يوضع وسم <p> داخل فقرة أخرى.
Call now
Contact WhatsApp
