احد تقسيمات عناصر الويب من حيث طريقة العرض
- الفقرة/المجموعة/ الكتلة (Block): هي العناصر التي تبدأ و تنتهي محتواها بسطر جديد عند استخدامها و تملأ عرض الشاشة وهي مثل
<p>و<h1>الى<h6>و<ul>وغيرها - داخل السطر (Inline): هي العناصر التي لا تحتاج الى سطر جديد و توجد داخل النص مثل
<b>و<small>و<strong>
<div> و <span>
داخل عناصر الويب المختلفة كل المحتوى ينطبق عليه نفس الطراز/النمط (style) وطريقة العرض. لكن ماذا اردنا انا نغير جزء من هذا المحتوى؟ مثلا، اردنا ان نجعل مجموعة من الكلمات باللون الاحمر داخل فقرة معينة!! او اردنا نجعل مجموعة من العناصر لهم نفس الطراز او الصفات!!.
<div> و <span> هم احدى الطرق لجمع مجموعة من العناصر او المحتوى داخل مجموعة واحدة و الفرق
<div>
<div> هي من نوع العناصر الفقرة/الكتلة (block) فهي تقوم بوضع المحتوى داخلها في سطر جديد. وهي من اكثر العناصر التي تستخدم لتجميع عناصر مع بعضها واعطاءها نفس الخصائص، مثال:
<html> <head> </head> <body> <div style="color:red;text-align:center"> <h1> القسم الاول</h1> <p> فقرة 1 </p> <p> 2قرة 1 </p> </div> <div style="color:blue;text-align:right"> <h1> القسم الثاني</h1> <p> فقرة 1 </p> <p> 2قرة 1 </p> </div> </body> </html>
<span>
هي نوع من العناصر داخل السطر (inline) التي لا تحتاج الى سطر جديد لاستخدامها، مثلا اذا اردنا ان نجعل بعض الكلمات داخل فقرة ما لها طراز مميز. مثال:
<html> <head> </head> <body> <p> نستطيع ان نجعل بعض الكلمات ذات <span style="color:red;"> لون خاص </span> مثل تلك الفقرة </p> </body> </html>
0 تعليقات