درس بسيط في لغة HTML

درس بسيط في لغة HTML.

سنتعرف في هذا المقال في عجالة على لغة إتش تي إم إل أو كما يحلو للبعض ان يسميها " هتمل " . Html هي لغة ترميز Markup تساعد المتصفح على قراءة محتوى صفحات الإنترنت 

HTML هي اختصار لـ "HyperText Markup Language" وهي لغة برمجة تستخدم لبناء صفحات الويب. تعتمد لغة HTML على علامات (tags) وعناصر (elements) لوصف هيكل الصفحة وتحديد محتواها. سأقدم لك بعض العناصر الأساسية في HTML وكيفية استخدامها.

تستخدام لغة HTML لإنشاء صفحات الويب. يتم فيها استخدام العناصر والوسوم لتحديد الهيكل والمحتوى على الصفحة. يتم استخدام العنصر "head" لتحديد معلومات الصفحة مثل العنوان ووصف المحتوى، والعنصر "body" لتحديد المحتوى الفعلي للصفحة. يمكن استخدام العنصر "h1" لتحديد العنوان الرئيسي للصفحة، ويمكن استخدام العنصر "p" لإضافة فقرات. يمكن استخدام العنصر "a" لإنشاء روابط، ويمكن استخدام العنصر "img" لإضافة صور. يمكن استخدام العنصر "ul" لإنشاء قوائم غير مرتبة والعنصر "ol" لإنشاء قوائم مرتبة. يمكن استخدام العنصر "table" لإنشاء جداول، ويمكن استخدام العنصر "form" لإنشاء نماذج.باستخدام لغة HTML يمكننا أيضاً تحديد الخصائص والأنماط لعناصر الصفحة، كما يمكن إدراج الفيديوهات والصوتيات باستخدام العناصر "video" و "audio" على التوالي. بالإضافة إلى ذلك، يمكن استخدام العنصر "canvas" لرسم الرسومات والصور على الصفحة، ويمكن استخدام العنصر "svg" لإنشاء الرسومات المتجهة. ويمكن أيضاً استخدام لغات البرمجة الأخرى مثل CSS و JavaScript لتنسيق وتحسين أداء صفحات الويب.

 هذه بعض العناصر الأساسية في لغة HTML.

1. عنصر الرأس (Headings) تستخدم لإظهار عنوان الصفحة، يتم تحديد مستوى العنوان بإضافة رقم (1-6) قبل العنوان.

   عاشق الوطن عنوان المستوى الأول

   عاشق الوطن عنوان المستوى الثاني

   عاشق الوطن عنوان المستوى الثالث

وهكذا كلما زاد الرقم صغر حجم الخط

<h1>عنوان المستوى الأول< h1/>

<h2>عنوان المستوى الثاني< h2/>

<h3>عنوان المستوى الثالث< h3/> 

2. الفقرات (Paragraphs) تستخدم لعرض نص بشكل فقرات

   هذه فقرة نص تستخدم لعرض نص بشكل فقرات

3. <p>هذه فقرة نص تستخدم لعرض نص بشكل فقرات.< /p>

3. الصور (Images) تستخدم لإدراج صورة في الصفحة، يتم تحديد مسار الصورة في الخاصية "src" ويمكن تحديد العرض والارتفاع في الخصائص "width" و "height".

<img src="image.jpg" alt="وصف الصورة" width="500" height="500">

4. الروابط (Links) تستخدم لإنشاء رابط يشير إلى صفحة أخرى، يتم تحديد رابط الصفحة في الخاصية "href". كمثال اضغط هنا ستذهب للصفحة الرئيسية😁👈 عاشق الوطن

<a href="http://example.com">رابط الصفحة</a>

5. القوائم (Lists) تستخدم لإنشاء قائمة، يمكن إنشاء قائمة مرتبة (ordered list) باستخدام العنصر "ol" وقائمة غير مرتبة (unordered list) باستخدام العنصر "ul". يتم تحديد كل عنصر في القائمة باستخدام العنصر "li".
   • عنصر القائمة 1
   • عنصر القائمة 2
   • عنصر القائمة 3

<ul>
  <li>عنصر القائمة 1</li>
  <li>عنصر القائمة 2</li>
  <li>عنصر القائمة 3</li>
</ul>
<ul>
  <li>عنصر القائمة 1< /li>
  <li>عنصر القائمة 2< /li>
  <li>عنصر القائمة 3< /li>
</ul>

هذه بعض العناصر الأساسية في لغة HTML، وهناك الكثير من العناصر والخصائص الأخرى التي يمكن استخدامها في بناء صفحات الويب. يمكن العثور على المزيد من المعلومات والمصادر التعليمية على الإنترنت، ويمكنك استخدام المحررات النصية الخاصة بالويب مثل Notepad++ أو Sublime Text لكتابة وتحرير ملفات HTML