العناصر والرموز الأكثر استعمالاً لبناء موقع ويب وتطويره بلغة HTML
عناصر وعلامات HTML
هذه الصفحة هي عبارة عن قـوائـم تشمل عدداً مهماً من علامات HTML الأكثر استعمالاً . إذا أحسنت استعمالها،سَهُلَ عليك ما بعدهـا.
ستجد في الجداول تحت عدداً كبيراً من علامات HTML ، منها ما سبق لك رؤيته، ومنها ما هو جديد! والجديد سيصبح قديماً بعد التَّعرف عليها، وستطلب المزيد طبعاً ..>>
يمكنك استخدام هذا الملحق كمرجع فقط للتذكير عند إنشاء أو تطوير موقعك على الويب.-
عناصر HTML، المستوى الأول
عناصر المستوى الأول هي العلامات الرئيسية التي تبني بها صفحة HTML. وهي ضرورية لتحقيق “الحد الأدنى من الكود” لصفحة الويب.
| رموز HTML | تعريفهـا |
|
<HTML> <HEAD> <BODY> |
العلامة الرئيسية رأس الصفحة جسم الصفحة |
أقصر رمز لصفحة HTML:
|
1 2 3 4 5 6 7 8 9 10 |
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>عنوان الصفحة</title> </head> <body> </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> | الأس |
-
علامات HTML لإنشاء القوائـم
يسرد هذا القسم جميع علامات HTML المستخدمة لإنشاء قوائم (قوائم نقطية ، قوائم مرقمة ، قوائم تعريف …)
(adsbygoogle = window.adsbygoogle || []).push({});
| رموز HTML | تعــريـفـهـا |
|
<ul> <ol> <li> <dl> <dt> <dd> |
قائمة نقطية ، غير مرقمة قائمة رقمية عنصر في القائمة النقطية قائمة التعريفات تحديد المصطلح تعريف المصطلح |
-
علامات HTML لإنشاء الجداول
| رموز 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> | العلامة الجنيسة من نوع الكتلة |
 |
إذا أعجبك هذا المحتوى، فلا تَقْرَأْ وتَرْحَل … تَـعْلِيقَـاتُكَ تَـشْجِيعٌ لَـنَـا لِنَسْتَمِرَّ فِــي الْبَحْثِ وَالْعَطَـاء. وإِذَا كنت تعتقد أنه قد يكون مفيداً لأشخاص آخرين، فشَارِكْهَ على الشبكات الاجتماعية.
