بسم الله الرحمن الرحيم
السلام عليكم ورحمة الله وبركاته
السلام عليكم ورحمة الله وبركاته
نبدأ بإذن الله تعالى في
تعلم اسياسيات html
أقدم لكم مجموعة عناصر html .. تصميم مواقع
* كل عناصر HTML5 المعتمدة مدرجة هنا، حيث أن اسماءها تصفها ومرتبة في مجموعات حسب وظائفها.
أقدم لكم مجموعة عناصر html .. تصميم مواقع
* كل عناصر HTML5 المعتمدة مدرجة هنا، حيث أن اسماءها تصفها ومرتبة في مجموعات حسب وظائفها.
مجموعة عناصر لغة html المعتمدة العنصر مع الوصف.
عناصر الـ HTML
عنصر الجذر
| العنصر | نبذة عنه |
|---|---|
| <html> | وهو يمثل جذر الـ HTML أو مستند XHTML و يجب أن تكون جميع العناصر الأخرى من نسل هذا العنصر. |
البيانات الرئيسة للوثيقة
| العنصر | نبذة عنه |
|---|---|
| <head> | وهو يمثل مجموعة من البيانات الوصفية حول الوثيقة بما في ذلك الوصلات أو تعريفات و البرامج النصية والسكريبتات و انماط الـ CSS . |
| <title> | يحدد عنوان الوثيقة كما هو موضح في شريط عنوان المتصفح أو في علامة التبويب الصفحة ولابد أن يحتوي على نصوص فقط لا غير . |
| <style> | يستخدم لكتابة CSS داخل وثيقة HTML . |
| <link> | وهو يستخدم لربط ملفات ألـ CSS والـ Javascript الخارجي مع وثيقة HTML . |
| <meta> | يستخدم لتعريف العناصر التي لايمكن تعريفها مثل الترميز وغير من الاستخدامات الاخرى . |
| <base> | وهو يحدد الرابط الفتراضي للوثيقة كي يتم من خلاله فرز الروابط المنتسبة لصفحة من الرابط التابعه لاجناس اخرى . |
البرمجة
| العنصر | نبذة عنه |
|---|---|
| <script> | يستخدم لربط ملف نصي برمجي خارجي او تضمين ملف نص برمجي ويمكن الكتابة داخله بالغات متعدده مثل javascript او php و غيره . |
| <noscript> | يحدد محتوى بديل لعرضه عندما لا يدعم المتصفح البرمجة . |
| <template> | حاوية للمحتوى العميل أثناء وقت التشغيل باستخدام جافا سكريبت . |
اقسام التضمين
| العنصر | نبذة عنه |
|---|---|
| <body> | وهو يمثل محتوى وثيقة HTML ولابد ان تكون كل العناصر الضاهره في الجسم داخلة . |
| <section> | يمثل قطعه في في المستند . |
| <nav> | يحدد المقطع الذي يحتوي على ارتباطات التنقل . |
| <article> | يحدد محتوى منفصل بذاته والذي يمكن أن يوجد بشكل مستقل عن بقية المحتوى. |
| <aside> | عرف بعض المحتويات التي لها علاقة فضفاضة إلى محتوى الصفحة. إذا تم إزالته ، والمحتوى المتبقية لا يزال من المنطقي . |
| <h1>,<h2>,<h3>,<h4>,<h5>,<h6>; | وهو يمثل 6 مستويات من عناوين النصية واكبرهم حجماً وعكسه |
| <header> | يحدد محتوى بذاتها التي يمكن أن توجد بشكل مستقل عن بقية المحتوى . |
| <footer> | يحدد تذييل للصفحة أو قسم فإنه غالبا ما يحتوي على إشعار حقوق التأليف والنشر وبعض الروابط على المعلومات القانونية أو عناوين . |
| <address> | يعرف الجزء الذي يحتوي على معلومات للإتصال به. |
| <main> | يحدد المحتوى الرئيسي أو مهم في الوثيقة. هناك واحد فقط |
جداول البيانات
| العنصر | نبذة عنه |
|---|---|
| <p> | يحدد الجزء الذي يجب أن يتم عرض كفقرة . |
| <ol> | يحدد قائمة مرتبة مرقمة من العناصر . |
| <li> | يحدد عنصر من قائمة التعداد. |
| <dl> | تعرف على قائمة تعريف ، وهذا هو ، على قائمة المصطلحات والتعاريف المرتبطة بها . |
| <dt> | يمثل مصطلح يعرفه القادم < DD > . |
| <dd> | يمثل تعريف المصطلحات الواردة فورا قبل ذلك. |
| <figure> | يمثل الرقم يتضح كجزء من الوثيقة. |
| <div> | يمثل وعاء العامة مع عدم وجود معنى خاص . |
عناصر النصوص
/| العنصر | نبذة عنه |
|---|---|
| <a> | يمثل الارتباط التشعبي وربط إلى مورد آخر . |
| <em> | يمثل خط مائل . |
| <strong> <small> | <strong> يمثل خط مشدد <small> يمثل خط نحيف. |
| <s> <q> | <s> يمثل نص مشطوب او محذوف <q> يمثل الاقتباس المضمنة. |
| <cite> | يمثل عنوان العمل. . |
| <dfn> | يمثل مصطلح الذي يرد في أقرب محتوى الجد التعريف. |
| <abbr> | يمثل اختصار أو اختصار . التوسع في اختصار يمكن أن تكون ممثلة في سمة العنوان. |
| <date> | الزميلة ل محتواه ما يعادل المقروءة آليا . ( هذا العنصر فقط في إصدار WHATWG للمعيار HTML ، و ليس في الإصدار W3C من HTML5 |
| <time> | يمثل قيمة التاريخ والوقت . أي ما يعادل المقروءة آليا يمكن أن تكون ممثلة في سمة التاريخ والوقت . |
| <code> <var> | <code> يمثل عنصر يكتب بداخله الكود <var> يمثل المتغير ، وهذا هو ، تعبير أو البرمجة الرياضية السياق الفعلي ، معرف تمثل ثابت ، رمزا تحديد الكمية الفعلية ، معلمة وظيفة ، أو مجرد نائب في النثر . <samp> يمثل الناتج من برنامج أو جهاز كمبيوتر . |
| <samp> | يمثل الناتج من برنامج أو جهاز كمبيوتر . |
| <kbd> | تمثل مدخلات المستخدمين، في كثير من الأحيان من لوحة المفاتيح ، ولكن ليس بالضرورة . قد تمثل المدخلات الأخرى ، مثل الأوامر الصوتية كتب . |
| <i> | تمثل بعض النص في صوت بديل أو المزاج، أو على الأقل من نوعية مختلفة ، مثل تسمية التصنيف، مصطلح تقني ، عبارة اصطلاحية ، الفكر، أو اسم السفينة |
| <b> | يمثل نص مشدد . |
| <u> | يمثل annoatation غير النصية التي العرض التقليدية و التسطير ، واصفة هذا النص كما يجري أخطأ في الهجاء أو وصفها الاسم الصحيح في النص الصيني |
| <sub> <sup> | يمثل نص منخفظ او مرتفع |
| <mark> | يمثل نص مشار اليه بالون الاصفر |
| <ruby> | يمثل المحتوى إلى أن تكون علامة مع شروح روبي ، المديين القصير من النص قدمت جنبا إلى جنب مع النص. وكثيرا ما يستخدم هذا بالتزامن مع لغة شرق آسيا حيث تعمل شروح كدليل للنطق ، مثل furigana الياباني . . |
| <rp> | يمثل قوسين حول الشرح روبي ، وتستخدم لعرض الشرح بطريقة بديلة من قبل المتصفحات لا تدعم العرض القياسية ل شروحه. |
| <bdi> | يمثل النص الذي يجب أن تكون معزولة عن محيطها ل تنسيق النص ثنائي الاتجاه . لأنها تتيح تضمين فترة من النص مع مختلف أو غير معروف، الاتجاهية . |
| <rt> | يمثل نص الشرح روبي . |
| <br> | يمثل سطر جديد |
| <span> | يمثل النص مع عدم وجود معنى محدد . هذا لابد من استخدامها عند ينقل أي عنصر النص الدلالي الآخرين معنى كاف، وهو ، في هذه الحالة، وغالبا ما رفعتها سمات عالمية مثل الطبقة ، لانج ، أو دير. |
| <wbr> | يمثل فرصة كسر خط ، وهذا هو نقطة المقترحة لل التفاف النص من أجل تحسين إمكانية القراءة من تقسيم النص على عدة أسطر . |
التضمين والميديا
\| العنصر | نبذة عنه |
|---|---|
| <img> | يستخدم لربط الصور بالوثيقه |
| <iframe> | يمثل السياق تصفح متداخلة ، وهذا هو وثيقة HTML المضمنة. |
| <embed> | تمثل نقطة التكامل ل خارجي ، في كثير من الأحيان غير HTML ، تطبيق أو المحتوى التفاعلي . |
| <object> | تمثل الموارد الخارجية ، التي تعامل على أنها صورة، وثيقة الفرعية HTML ، أو الموارد الخارجية التي سيتم تجهيزها من قبل في المكونات . |
| <param> | تعرف المعلمات للاستخدام من قبل المكونات الإضافية التي يحتج بها <كائن > العناصر. |
| <video> | يمثل الفيديو ، والملفات المرتبطة به الصوت و تعليق عليها، مع واجهة اللازمة لتشغيله . |
| <audio> | يمثل الصوت ، أو تيار الصوت. |
| <source> | يسمح المؤلفين لتحديد الموارد وسائل الإعلام البديلة ل عناصر الوسائط مثل <video> or <audio>. |
| <track> | يسمح المؤلفين لتحديد مسار النص توقيت ل عناصر الوسائط مثل <video> or <audio>. |
| <canvas> | تمثل منطقة خريطة أبيت أن النصوص يمكن استخدامها ل تقديم الرسومات ، مثل الرسوم البيانية والرسوم البيانية لعبة ، أو أي الصور المرئية على الطاير . |
| <map> | بالتزامن مع <area>, يحدد مخطط صورة. |
| <area> | بالتزامن مع <map>,يحدد مخطط صورة. |
| <svg> | تعرف على إد الإدارة الانتخابية دائرة التنمية الاقتصادية صورة اتجاهي . |
| <math> | يحدد صيغة رياضية. |
جدول البيانات
| العنصر | نبذة عنه |
|---|---|
| <table> | تمثل البيانات مع أكثر من بعد واحد. |
| <caption> | يمثل عنوان الجدول. |
| <colgroup> | تمثل مجموعة من واحد أو أكثر من الأعمدة من الجدول. |
| <col> | يمثل عمود من الجدول. |
| <tbody> | يمثل كتلة من الصفوف التي تصف البيانات ملموسة من الجدول. |
| <thead> | يمثل كتلة من الصفوف التي تصف التسميات عمود من الجدول. |
| <tfoot> | يمثل كتلة من الصفوف التي تصف ملخصات عمود من الجدول. |
| <tr> | يمثل صف من الخلايا في الجدول. |
| <td> | يمثل خلية البيانات في الجدول. |
| <th> | يمثل خلية رأس في الجدول. |
الاشكال
| العنصر | نبذة عنه |
|---|---|
| <form> | عنصر تبادل المعلومات مع الخادم حيث يكون داخله مجموعه من العناصر تتيح لمستخدم التعديل والاضافه |
| <fieldset> | مثل عنصار او ضوابط مرتبة |
| <legend> | يمثل عنوان <fieldset> . |
| <label> | يعتبر توضيح او اسم عنصر داخل <form> |
| <input> | يمثل حقل من البينات مما يتحُيح للمستخدم استعمالها |
| <button> | عبارة عن زر |
| <select> | يمثل مجموعه من الخيارات المٌسدله المرتبة . |
| <datalist> | يمثل قائمة منسدله تحوي مجموعه من الخيارات المعدة مسبقاً اشبه باقائمة . |
| <optgroup> | يمثل عنوان لمجموعه خيارات <option> الي تكون ادخل <optgroup> الي هي داخل <datalist>. |
| <option> | يمثل خيارات داخل العنصر < select> أو اقتراح من<datalist> |
| <textarea> | مربع يكتب بداخله نص يمكن التحكم به . |
| <keygen> | يمثل سطر مولد مفاتيح . |
| <output> | سَحاب يمكن التحكم به . |
| <progress> | يمثل شريط اخذ بالمتلاء يعني مثل الداون لود منيجر لما يكون ايحمل |
| <meter> | يمثل قيمة مئويه اخذه بالمتلاء بشكل صغير . |
التعديلات
| العنصر | نبذة عنه |
|---|---|
| <ins> | عنصر مضاف او تم تعديله |
| <del> | عنصر محذوف وهو مثيل العنصر <s> |
العناصر التفاعلية
| العنصر | نبذة عنه |
|---|---|
| <details> | يمثل قائمة مُنسدله من الخيارات |
| <summary> | وهو يمثل عنوان لقائمة العنصر <details> . |
| <menuitem> | يمثل الأوامر التي تمكن المستخدم من الاستدعاء. |
| <menu> | يمثل قائمة من العناصر . |