في لغة HTML، تُشير علامة <div> إلى عنصر "قسم" أو "حاوية". تُستخدم هذه العلامة لتنظيم وتجميع محتوى صفحة الويب، دون أن تُضيف أي معنى دلالي خاص به.
بمعنى آخر، تُعتبر علامة <div> عنصرًا عامًا يمكن استخدامه لإنشاء أقسام أو مجموعات منطقية داخل الصفحة،
وتسهيل عملية تنسيقها باستخدام لغة CSS.
مميزات استخدام علامة <div>:
تنظيم المحتوى: تُساعد علامة <div> على تقسيم محتوى الصفحة إلى أقسام منطقية، مما يُسهل عملية قراءته وفهمه.
التنسيق باستخدام CSS: يمكن ربط علامة <div> بخصائص CSS لتحديد مظهرها وسلوكها، مثل لون الخلفية، وحجم الخط، وموضعها على الصفحة.
إنشاء تخطيطات الصفحة: تُستخدم علامة <div> بكثرة لإنشاء تخطيطات الصفحة، مثل تخطيطات الأعمدة وتصميمات الصفحات المُتعددة.
إضافة سمات دلالية: يمكن إضافة سمات دلالية إلى علامة <div> لتحديد محتواها بشكل أفضل، مثل lang لتحديد لغة المحتوى، أو class لتصنيف المحتوى.
ملاحظة: لا تُضيف علامة <div> أي معنى دلالي خاص
لمحتواها.
أمثلة على استخدام علامة <div>:
إنشاء قسم رئيسي للمحتوى:
HTML
<div id="main-content">
<h1>عنوان الصفحة</h1>
<p>محتوى الصفحة</p>
</div>
يُرجى استخدام الرمز البرمجي بحذر.
content_copy
إنشاء شريط جانبي:
HTML
<div id="sidebar">
<ul>
<li><a href="#">عنّا</a></li>
<li><a href="#">خدماتنا</a></li>
<li><a href="#">اتصل بنا</a></li>
</ul>
</div>
يُرجى استخدام الرمز البرمجي بحذر.
content_copy
تحديد منطقة قابلة للتمرير:
HTML
<div id="scrollable-area" style="overflow-y: scroll;">
<p>محتوى طويل قابل للتمرير</p>
</div>
يُرجى استخدام الرمز البرمجي بحذر.
content_copy
ختامًا: تُعتبر علامة <div> من أهم العناصر في لغة HTML
لتنظيم وتنسيق محتوى صفحات الويب.
فمع سهولة استخدامها وقدرتها على التكيف مع مختلف
الاحتياجات، تُعدّ أداة أساسية لإنشاء تصميمات
مُنظمة وجذابة.