عنصر br و hr في الـ HTML

نبذة عامة

كثيراََ ما نرى أن بعض الجمل تكون كل جملة بسطر لوحدها ، كيف نقوم بذلك في الـ HTML !

عنصر الـ <br>

لو قمت بكتابة هذا النص الكبير كفقرة ..

<p>
	Lorem ipsum dolor sit amet consectetur adipisicing elit. Nobis facilis distinctio
	maxime quia reprehenderit voluptatum, laudantium dolorem. 
	Ipsum dignissimos animi ut, quia sed odio eum accusamus deserunt, rem libero fugit?	
	Lorem ipsum dolor sit amet consectetur adipisicing elit. Nobis facilis distinctio maxime quia 
	reprehenderit voluptatum, laudantium dolorem. Ipsum dignissimos animi ut, 
	quia sed odio eum accusamus deserunt, rem libero fugit?	
</p>

بالرغم من النزول سطر عند كتابتي لهذا النص بالمحرر الخاص بي ، الإ ان المتصفح لم يقرأ هذا السطر . !

لو قمت بكتابة النص بهذا الشكل ووضع Enter ما بين كل سطر وسطر ، لن يظهر كذلك بالمتصفح لان المتصفح لا يقرأ الـ Enter أو المسافات يقرأ مسافة واحدة فقط بمعنى لو قمت بوضع العديد من المسافات           بين كلمتين لن يقرأها المتصفح الا مسافة واحدة فقط ، ولكن يوجد بعض الطرق لحلها سنذكرها لاحقاََ .

ويتم استخدام عنصر الـ <br> من أجل عمل  سطر جديد وهو اختصار لـ break line  لو قمت بعمل الكود السابق ولكن مع اضافة <br> بالمكان الذي تريد النزول سطر بها ، مثال :

<p>
	Lorem ipsum dolor sit amet consectetur adipisicing elit. Nobis facilis distinctio <br>
	maxime quia reprehenderit voluptatum, laudantium dolorem. <br>
	Ipsum dignissimos animi ut, quia sed odio eum accusamus deserunt, rem libero fugit?	 <br>
	Lorem ipsum dolor sit amet consectetur adipisicing elit. Nobis facilis distinctio maxime quia  <br>
	reprehenderit voluptatum, laudantium dolorem. Ipsum dignissimos animi ut,  <br>
	quia sed odio eum accusamus deserunt, rem libero fugit?	
</p>

وستكون النتيجة كالتالي:

ممكن استخدامها على سبيل المثال وليس الحصر ، مع العلم يوجد بدائل اخرى لهذا المثال ، ممكن ان يتم استخدامها للفصل بين رقم الهاتف ، والبريد الإلكتروني والعنوان .. إلخ ..

<p>
	Phone: 00972597114585 <br>
	Email: [email protected] <br>
	Website: akwade.com	 <br>
	Address: Palestine - Gaza   
</p>

عنصر الـ <hr>

وهو إختصار لـ Horizontal Rule يعمل هذا العنصر على إضافة فاصل بين الفقرات ، ممكن استخدامه كنوع من الاستايل فمثلاََ لو كنت تتكلم في فقرة أو قسم معين عن شىء معين وأنتهيت منه بإمكانك وضع هذا العنصر من ثم كتابة الفقرة الأخرى ، مثال :

<p>
	Phone: 00972597114585 
	<hr>
	Email: [email protected] 
  <hr>
	Website: akwade.com	  
	<hr>
	Address: Palestine - Gaza   
  <hr>
</p>

النتيجة :

ملاحظات

عنصر الـ <br> و <hr> من عناصر الـ Block بمعنى انها سوف تأخد كامل السطر وتعمل مسافة قبل وبعد العنصر .

عنصر الـ <br> و <hr> من العناصر التى ليست لها وسم نهاية فقط .