الفقرات في HTML
يا هلا بالجميع! اليوم بنشوف كيف نتعامل مع الفقرات في HTML، شيء أساسي في أي صفحة ويب. الفقرات هي اللي تخلي النص منظم ومقروء.
عشان تسوي فقرة، تستخدم وسم <p> (اختصار لـ paragraph). كل شيء داخل هذا الوسم يعتبر فقرة لحالها.
مثال بسيط على الفقرات:
<p>هذي فقرة بسيطة. شوف كيف المتصفح بيعرضها.</p>
<p>وهذي فقرة ثانية. كل فقرة تبدأ بسطر جديد.</p>كيف يتعامل المتصفح مع المسافات والأسطر؟
نقطة مهمة: المتصفح يتجاهل أي مسافات إضافية أو أسطر جديدة داخل وسم <p>. يعني لو حطيت عشرين مسافة بين الكلمات، المتصفح بيشوفها مسافة وحدة بس. ونفس الشيء للأسطر الجديدة، كلها بتصير مسافة وحدة.
مثال يوضح تجاهل المسافات الزائدة:
<p>
هذي فقرة
فيها
مسافات
وأسطر
كثيرة.
</p>
<p>
شوف كيف
المتصفح
بيعرضها
وكأنها
سطر واحد
بمسافات
عادية.
</p>النزول لسطر جديد داخل الفقرة: وسم <br>
طيب، لو أبي أنزل سطر داخل نفس الفقرة؟ هنا يجي دور وسم <br> (اختصار لـ break). هذا وسم فردي (ما له وسم إغلاق) ومهمته بس ينزل سطر جديد.
مثال على استخدام <br>:
<p>
هذي فقرة فيها أكثر من سطر.<br>
هذا السطر الثاني بفضل وسم <code>br</code>.<br>
وهذا السطر الثالث.
</p>الخط الأفقي الفاصل: وسم <hr>
أحياناً تحتاج خط أفقي عشان تفصل بين أقسام المحتوى بشكل بصري. هنا نستخدم وسم <hr> (اختصار لـ horizontal rule). هذا برضه وسم فردي وما له وسم إغلاق.
مثال على استخدام <hr>:
<p>هذا جزء من المحتوى.</p>
<hr>
<p>وهذا جزء ثاني مفصول بخط.</p>تذكر دايماً:
<p>للفقرات،<br>للنزول لسطر جديد داخل الفقرة، و<hr>لخط فاصل أفقي. هذي الأساسيات بتخلي صفحتك مرتبة وحلوة.