عناصر وعلامات HTML

العناصر والرموز الأكثر استعمالاً لبناء موقع ويب وتطويره بلغة HTML

عناصر وعلامات HTML

هذه الصفحة هي عبارة عن قـوائـم  تشمل عدداً مهماً من علامات HTML الأكثر استعمالاً . إذا أحسنت استعمالها،سَهُلَ عليك ما بعدهـا.

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

ستجد في الجداول تحت عدداً كبيراً من علامات HTML ، منها ما سبق لك رؤيته، ومنها ما هو جديد!  والجديد سيصبح قديماً بعد التَّعرف عليها، وستطلب المزيد طبعاً ..>>

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

عناصر المستوى الأول هي العلامات الرئيسية التي تبني بها صفحة HTML. وهي ضرورية لتحقيق “الحد الأدنى من الكود” لصفحة الويب.

رموز HTML تعريفهـا

<HTML>

<HEAD>

<BODY>

العلامة الرئيسية

رأس الصفحة

جسم الصفحة

أقصر رمز لصفحة HTML:

 

  • عنـاصر رأس الصفحة  «En-tête »

جميع  العلامات الموجودة في الجدول الموالي تتواجد في رأس صفحة الويب ، بين <head> و </ head>:

رموز HTML تعــريـفـهـا

</link>

</meta>

<script>

<style>

<title>

رابط بين ملف محلي وآخر خارجي 

البيانات الوصفية لصفحات الويب مثل كلمات المفتاح

رمز JavaScript

كود CSS

 عنوان صفحة الويب

  • علامات HTML لهيكلة النص

رموز HTML تعــريـفـهـا
H1  عنوان المستوى الأول
H2  عنوان المستوى الثاني
H3  عنوان المستوى الثالث
H4  عنوان المستوى الرابع
H5  عنوان المستوى الخامس
H6  عنوان المستوى السادس
<a>   لكتابة الرابط إلى صفحة، إلى ملف، أو إلى موقع خارجي ..
<br />  العودة الى السطر
<img />  لإدراج صورة
<hr />  خط فاصل أفقي
<p>  لكتابة فقرة
<q>  اقتباس (قصير)
<time>  التاريخ والساعة
<dfn>  التعريف
<address>  عنوان الاتصال
<strong>  كلمات ذات معنى قوي
<blockquote>  اقتباس فقرة أو محتوى طويل
<pre>  عرض منسق لرموز وشفرات المصدر 
<cite>  اقتباس من عنوان كتاب او جزء  من مقالة
<em> كلمات ذات معنى عادي وتكتب بخط مائل
<ins>  إدراج النص
<progress> شريط التقدم والارتقاء
<del>  النص المحذوف
<sup>  الأس
ربما أكون قد أغفلت بعضها، لكن صدقوني أن هاته العلامات هي الأشهر والأكـثر استعمالاً في HTML5.
  • علامات HTML لإنشاء القوائـم

يسرد هذا القسم جميع علامات HTML المستخدمة لإنشاء قوائم (قوائم نقطية ، قوائم مرقمة ، قوائم تعريف …)

 

(adsbygoogle = window.adsbygoogle || []).push({});

رموز HTML تعــريـفـهـا

<ul>

<ol>

<li>

<dl>

<dt>

<dd>

 قائمة نقطية ، غير مرقمة

قائمة رقمية

عنصر في القائمة النقطية

قائمة التعريفات

 تحديد المصطلح 

تعريف المصطلح

  • علامات HTML لإنشاء الجداول

(adsbygoogle = window.adsbygoogle || []).push({});
رموز HTML تعــريـفـهـا
<table> الجدول
<caption>  عنوان الجدول
<tr>  صف أو سطر الجدول
<td>  الخلية
<th>  خلية الرأس
<thead>   قسم رأس الجدول
<tbody>  قسم جسم الجدول
<tfoot> قسم ذيل  الجدول ( اسفل الجدول )
  • علامات HTML لإنشاء النمـاذج والأشكال

رموز HTML تعــريـفـهـا
<form>  النموذج
<option> عنصر القائمة المنسدلة
<select>  القائمة المنسدلة
<optgroup> مجموعة من العناصر من القائمة المنسدلة
<fieldset>  مجموعة من الحقول
<legend> عنوان مجموعة من الحقول
<label>  قسم جسم الجدول
<input /> حقل النموذج (نص ، كلمة مرور ، خانة اختيار ، زر ، إلخ.)
  • علامات HTML لتقسيـم الصفحة

تساعد هذه العلامات في بناء الهيكل العظمي لموقعنا.

عناصر وعلامات HTML

رموز HTML تعــريـفـهـا
<header> رأس الصفحــة
<nav>  الروابط الرئيسية للتنقل داخل النت
<footer> أسفل الصفحة
<section> قسم الصفحة
<article>  مقال (محتوى مستقل)
<aside> معلومات إضافية

  • عناصـر التعديلات العامة

العناصر العامة هي علامات ليس لها معنى دلالي.

في الواقع، جميع عنـاصر HTML الأخرى لها معنى: <p> تعني “الفقرة” ، و <h2> تعني “العنوان الفرعي” ، إلخ.
نحتاج في بعض الأحيان إلى استخدام العناصر العامة (وتسمى أيضًا balises universelles) لأن أي من العلامات الأخرى غير مناسبة. غالبًا ما تستخدم العناصر العامة لبناء التصاميم الخاصة لمواقع الويب.

هناك رمزان عامان: إحداها مضمّنة ، والآخر كتلة.

رموز HTML تعــريـفـهـا
<span>  العلامة الجنيسة من نوع المضمنة
<div> العلامة الجنيسة من نوع الكتلة
إعــلـم جـيِّـداً :
أخبرك أن هذا الملحق غير كامل، ولكنه يشمل العناصر الأكثر استعمالاً. حاولتُ أن أدرج العناصر  التي تبدو لي مفيدة للغاية في الممارسة العملية، وأنصح بالحفاظ على رابطها للعودة إليها متى دعت الضرورة
إضــافــة :
يتم توفير مرجع شامل لعنـاصر HTML على موقع شبكة مطوري Mozilla: يمكنك زيارة الموقع من هنا

 

قناتي على اليوتيوبقناتي على اليوتوب

تنويرأرى أن هذه المواضيع الذات صلة قد تهمك:

 

شَـاركِ الْمَوْضُوع: 
إذا أعجبك هذا المحتوى، فلا تَقْرَأْ وتَرْحَل … تَـعْلِيقَـاتُكَ تَـشْجِيعٌ لَـنَـا لِنَسْتَمِرَّ فِــي الْبَحْثِ وَالْعَطَـاء. وإِذَا كنت تعتقد أنه قد يكون مفيداً لأشخاص آخرين، فشَارِكْهَ على الشبكات الاجتماعية.

اترك تعليقاً

لن يتم نشر عنوان بريدك الإلكتروني. الحقول الإلزامية مشار إليها بـ *

حول الكاتب :   من أقصى شمال المغرب كاتب مقالات إلكترونية حول كيفية بناء موقع ويب ناجح : ووردبريس ، HTML ، CSS .ومواضيع مختلفة وناشط على اليوتيوب في قناة: Jabism Web و رحيل الليل
كتب 445 مقالة في jabism.com.
-:- راسلني   -:- تابعني على تويتر   -:- تابعني على الفايسبوك

780 عدد المشاهدات لهذا المحتوى
Scroll to Top