logo

علامات HTML

تشبه علامات HTML الكلمات الرئيسية التي تحدد كيفية تنسيق متصفح الويب للمحتوى وعرضه. بمساعدة العلامات، يمكن لمتصفح الويب التمييز بين محتوى HTML والمحتوى البسيط. تحتوي علامات HTML على ثلاثة أجزاء رئيسية: علامة الفتح، وعلامة المحتوى، وعلامة الإغلاق. لكن بعض علامات HTML هي علامات غير مغلقة.

عندما يقرأ متصفح الويب مستند HTML، يقرأه المتصفح من الأعلى إلى الأسفل ومن اليسار إلى اليمين. تُستخدم علامات HTML لإنشاء مستندات HTML وعرض خصائصها. كل علامات HTML لها خصائص مختلفة.

يجب أن يحتوي ملف HTML على بعض العلامات الأساسية حتى يتمكن متصفح الويب من التمييز بين النص البسيط ونص HTML. يمكنك استخدام أي عدد تريده من العلامات وفقًا لمتطلبات الكود الخاص بك.

  • يجب وضع كافة علامات HTML داخل هذه الأقواس.
  • تؤدي كل علامة في HTML مهام مختلفة.
  • إذا كنت قد استخدمت علامة مفتوحة، فيجب عليك استخدام علامة إغلاق (باستثناء بعض العلامات)

بناء الجملة

محتوى


أمثلة على علامات HTML

ملاحظة: تتم كتابة علامات HTML دائمًا بأحرف صغيرة. علامات HTML الأساسية مذكورة أدناه:

علامة الفقرة

علامة العنوان

علامة جريئة

علامة مائلة

تسطير العلامة

اختبره الآن

علامات HTML غير المغلقة

بعض علامات HTML ليست مغلقة، على سبيل المثال br وhr.


بطاقة شعار
: br يرمز إلى خط الفاصل، فهو يكسر سطر الكود.


بطاقة شعار: hr تعني القاعدة الأفقية. يتم استخدام هذه العلامة لوضع خط عبر صفحة الويب.


علامات تعريف HTML

DOCTYPE والعنوان والرابط والفوقية والأسلوب


علامات نص HTML

,

مستوى العنوان 2

مستوى العنوان 3

مستوى العنوان 4

مستوى العنوان 5
مستوى العنوان 6

أربعة خمسة.
:

بمساعدة هذه العلامة، يمكننا تقسيم صفحة الويب. إنها تعني القاعدة الأفقية أو فاصل الموضوع.

بناء الجملة:

<hr>

46. ​​:

وبمساعدة هذه العلامة، يتم احتواء جميع العناصر الأخرى بها. ومن المعروف أيضًا باسم جذر عنصر HTML.

بناء الجملة:

 

47. :

بمساعدة هذه العلامة، يمكننا جعل أي محتوى بخط مائل. فهو يسلط الضوء على مصطلح أو عبارة أو مصطلح تقني مهم.

بناء الجملة:

 <i>Italicized Text</i> 

48.

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

بناء الجملة:

 <iframe src="url"></iframe>

49. :

وبمساعدة هذه العلامة، يمكننا تضمين صورة في صفحة الويب الحالية. فهو يربط صورة بالصورة دون إدراجها مباشرة في صفحة الويب.

بناء الجملة:

خمسون.

بمساعدة هذه العلامة، يمكننا تمكين التحكم التفاعلي في النموذج. يعتمد ذلك أيضًا على الحقول المختلفة لنوع السمة.

بناء الجملة:

51. :

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

بناء الجملة:

Inserted Text

52. :

بمساعدة هذه العلامة، يمكننا الإشارة إلى الجزء النصي من النص المضمن الذي يمثل لوحة مفاتيح المستخدم أو صوته أو أي جهاز آخر لإدخال النص.

بناء الجملة:

Keyboard Input

53. :

بمساعدة هذه العلامة، يمكننا تحسين سهولة الاستخدام لمستخدمي الماوس، أي أن النقر على الملصق سيؤدي إلى تبديل عنصر التحكم.

بناء الجملة:

Label Text

54. :

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

بناء الجملة:

 Fieldset Caption 

55.
  • :
  • بمساعدة هذه العلامة، يمكننا تمثيل قائمة العناصر الموجودة على صفحة الويب. يحتوي على قائمة مرتبة (غير مرتبة أو قائمة) كعنصر أصل.

    هي شخصية خاصة

    بناء الجملة:

    <ul> <li>List Item 1</li> <li>List Item 2</li> <li>List Item 3</li> </ul>

    56. :

    بمساعدة هذه العلامة، يمكننا ربط الموارد الخارجية بصفحة الويب الحالية.

    بناء الجملة:

    57. :

    بمساعدة هذه العلامة، يمكننا أن نجعل العنصر العادي هو العنصر الأكثر أهمية. علينا أن نكتب هذه العلامة داخل العلامة.

    بناء الجملة:

     

    58. :

    بمساعدة هذه العلامة، يمكننا تحديد صورة الخريطة. تحتوي خريطة الصورة أيضًا على منطقة قابلة للنقر عليها.

    بناء الجملة:

     

    59. :

    بمساعدة هذه العلامة، يمكننا تمثيل النص كما هو موضح، والذي سيتم استخدامه لأغراض مرجعية أو تدوينية. ونظراً لأهمية المحتوى، فقد سلط الضوء على النص.

    بناء الجملة:

    Highlighted Text

    60. :

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

    بناء الجملة:

    61. :

    بمساعدة هذه العلامة، يمكننا تمثيل القياسات ضمن نطاق معين أو قيم كسرية. ومن المعروف أيضا باسم المقياس.

    بناء الجملة:

    Fallback Content

    62. :

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

    بناء الجملة:

     

    63. :

    وبمساعدة ذلك، يمكننا توفير برنامج نصي بديل عندما لا يدعم متصفح المستخدم البرنامج النصي المعين. كما أنه يعمل عندما لا يدعم متصفح المستخدم البرمجة النصية من جانب العميل أو لا يدعم أي لغة برمجة نصية.

    بناء الجملة:

     

    64. :

    بمساعدة هذه العلامة، يمكننا عرض الوسائط المتعددة مثل الصوت والفيديو والصور وملفات PDF وفلاش على صفحات الويب.

    بناء الجملة:

    65.
      :

    يتم استخدام هذه العلامة لإنشاء القائمة المرتبة. يمكن أن تكون القائمة المرتبة رقمية أو أبجدية. داخل

      العلامة، يمكننا إنشاء القائمة باستخدام
    1. بطاقة شعار. ثم سوف يتبع الترتيب.

    بناء الجملة:

    <ol> <li>First Item</li> <li>Second Item</li> <li>Third Item</li> </ol>

    66. :

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

    بناء الجملة:

     Option 1 Option 2 

    67. :

    بمساعدة هذه العلامة، يمكننا تحديد الخيار في القائمة المنسدلة باستخدام العلامة.

    بناء الجملة:

     Option Text 

    68. :

    بمساعدة هذه العلامة، يمكننا إنشاء حاوية للعنصر الذي يُدخل نتيجة العملية الحسابية.

    بناء الجملة:

    69. :

    بمساعدة هذه العلامة، يمكننا تحديد علامة الفقرة. بمساعدة علامة الفقرة، يمكننا تمثيل الوسائط المرئية على شكل كتل نصية مفصولة عن الكتل المجاورة بأسطر فارغة أو مسافة بادئة للسطر الأول.

    بناء الجملة:

    Paragraph text goes here.

    70. :

    بمساعدة هذه العلامة، يمكننا تحديد المعلمة لكائن ما. بمساعدة هذا، يمكننا تمرير المعلمة لكائن مضمن آخر.

    بناء الجملة:

     

    71. :

    بمساعدة هذه العلامة، يمكننا توفير المرونة لصفحة الويب عن طريق تحديد الصورة. ويحتوي أيضًا على علامات مثل و .

    بناء الجملة:

      

    72.
    :

    بمساعدة هذه العلامة، يمكننا إعلان كتلة النص المنسق مسبقًا على صفحة الويب على أنها حرف منسق مسبقًا، مثل المسافات وفواصل الأسطر وعلامات التبويب وما إلى ذلك.

    بناء الجملة:

    النص المنسق مسبقا يذهب هنا.

    73. :

    بمساعدة هذه العلامة، يمكننا عرض تقدم المهمة. وبمساعدة ذلك، يمكن للمطور إنشاء شريط تقدم على صفحة الويب الخاصة به.

    بناء الجملة:

    74. :

    بمساعدة هذه العلامة، يمكننا إنشاء عرض أسعار مضمّن على صفحة الويب. النص موجود داخل علامات الاقتباس في معظم المتصفحات اليوم.

    بناء الجملة:

    Here is a short quotation within a sentence.

    75. :

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

    بناء الجملة:

     Base text (Ruby text) 

    76. :

    بمساعدة هذه العلامة، يمكننا تحديد نطق الحرف داخل التعليق التوضيحي الخاص بالروبي.

    بناء الجملة:

     Base text Ruby text 

    77. :

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

    بناء الجملة:

     Base text Ruby text 

    78. :

    بمساعدة هذه العلامة، يمكننا عرض النص بخط يتوسطه أو خط يتخلله. يمكننا استخدام هذه العلامة عندما لم تعد الأمور دقيقة أو ذات صلة.

    بناء الجملة:

    Struck-through text

    79. :

    بمساعدة هذه العلامة، يمكننا تحديد نموذج إخراج برنامج الكمبيوتر. يتم عرض محتوى هذه العلامة باستخدام خط أحادي المسافة في المتصفح.

    بناء الجملة:

    Sample text or code goes here

    80. :

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

    بناء الجملة:

    81. :

    بمساعدة هذه العلامة، يمكننا إنشاء رأس وتذييل الصفحة أو أي قسم آخر على صفحة الويب.

    بناء الجملة:

     

    82. :

    بمساعدة هذه العلامة، يمكننا تحديد قائمة الخيارات داخل القائمة.

    بناء الجملة:

     Option Text 

    83. :

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

    بناء الجملة:

    Small text goes here

    84.

    بمساعدة هذه العلامة، يمكننا ربط موارد الوسائط المتعددة مثل و،

    بناء الجملة:

    85.

    بمساعدة هذه العلامة، يمكننا تحديد المحتوى على أنه مهم للغاية. سيعرض المتصفح هذا العنصر بالخط العريض.

    بناء الجملة:

     <strong>Emphasized text</strong> 

    86.:

    إنه العنصر الأكثر عمومية في HTML. يمكننا تطبيق النمط من خلال تجميع العناصر.

    بناء الجملة:

    <span>Text or content goes here</span>

    87. :

    يمكننا توفير معلومات النمط للمستند بمساعدة هذه العلامة.

    بناء الجملة:

     CSS rules go here 

    88.:

    بمساعدة هذه العلامة، يمكننا عرض العنصر المنخفض فقط لأسباب مطبعية.

    ريجكس جافا

    بناء الجملة:

    <sub>Subscript text</sub>

    89. :

    بمساعدة هذه العلامة، يمكننا إنشاء مربع بمساعدة العنصر الذي يحتوي على الملخص أو التسمية التوضيحية أو وسيلة الإيضاح. عندما نضغط على زر الملخص، فإنه يؤدي إلى حالة الفتح/الإغلاق للعنصر الأصلي *details>.

    بناء الجملة:

     Summary text 

    90.:

    بمساعدة هذه العلامة، يمكننا عرض أي نص كخط مرتفع للعنصر المضمّن.

    بناء الجملة:

    <sup>Superscript text</sup>

    91. :

    بمساعدة هذه العلامة، يمكننا تضمين الرسوم البيانية SVG في صفحة الويب. يمكننا أيضًا تحديد الرسومات المتجهة بتنسيق XML بمساعدة هذه العلامة.

    بناء الجملة:

     

    92.:

    بمساعدة هذه العلامة، يمكننا تحديد البيانات بتنسيق جدولي بتنسيق HTML. سيتم إنشاء جدول ثنائي الأبعاد يحتوي على بعض الصفوف والأعمدة.

    بناء الجملة:

    <table class="table"> </table>

    93.:

    بمساعدة هذه العلامة، يمكننا تغليف صفوف الجدول المرتبطة بنص الجدول.

    بناء الجملة:

    <table class="table"> <tbody> </tbody> </table>

    94.:

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

    بناء الجملة:

    <tr> <td>Table cell content</td> </tr>