الدرس 2: العناصر الأساسية في HTML

في هذا الدرس سنتعرف على أهم الوسوم (Tags) التي تُشكّل البنية الأساسية لأي صفحة HTML. هذه الوسوم تُستخدم لتحديد محتوى الصفحة وترتيبه بشكل منطقي ومقروء من قبل المتصفح.

1. وسم <!DOCTYPE>

هذا الوسم يُستخدم في أول سطر من أي ملف HTML. يُخبر المتصفح بنوع الوثيقة المستخدمة. في HTML5 نكتبه هكذا:

<!DOCTYPE html>

2. وسم <html>

هو الجذر الذي يحتوي على كل عناصر الصفحة.

<html lang="ar">
  ... محتوى الصفحة ...
</html>

3. وسم <head>

يحتوي على معلومات غير مرئية للمستخدم مثل العنوان، الروابط، الخطوط، الميتا تاجز:

<head>
  <meta charset="UTF-8">
  <title>عنوان الصفحة</title>
</head>

4. وسم <title>

يظهر في شريط عنوان المتصفح، وهو عنوان الصفحة.

5. وسم <body>

يحتوي على كل ما يظهر داخل المتصفح: نصوص، صور، أزرار، روابط... إلخ.

6. العناوين: <h1> إلى <h6>

تُستخدم لتحديد العناوين بمستويات مختلفة. <h1> هو الأعلى، و<h6> هو الأصغر.

<h1>عنوان رئيسي</h1>
<h2>عنوان فرعي</h2>

7. وسم الفقرة <p>

يُستخدم لكتابة فقرة من النص.

<p>هذه فقرة نصية</p>

🎥 شاهد الفيديو على يوتيوب

8. وسم السطر الجديد <br>

يُستخدم لكسر السطر وإجبار النص على النزول لسطر جديد.

مرحباً<br>بالعالم

9. وسم الخط الفاصل <hr>

يرسم خط أفقي بين أجزاء الصفحة، غالبًا للفصل بين أقسام.

<hr>

خاتمة

هذه الوسوم هي حجر الأساس لأي صفحة HTML. بتعلّمها، ستتمكن من كتابة صفحاتك الأولى بسهولة واحتراف.