#17 كورس html كامل بالعربي | form input
HTML-код
- Опубликовано: 12 сен 2024
- ماذا تعني لغة الترميز HTML؟ ما هي أنواع الوسوم - Tags أو عناصر HTML؟ وما هي المكونات الأساسية لعناصر HTML؟ وشرح باللغة العربية خطوة بخطوة لـ تعلم لغه html، كيفية إنشاء صفحة ويب بإستخدام أكواد HTML
________________
للتواصل معي
حسابي على instagram :
/ abdelrahman_noufal
حسابي على فيسبوك :
/ abdelrahman.g.nofal
الجروب الخاص بنا :
/ 1810581845642171
________________
تحميل محرر الاكواد visual studio لاجهزة الكومبيوتر
code.visualstu...
_______________
كورس css في فيديو واحد هنا
• تعلم css في فيديو واحد...
ماهي لغة الترميز HTML؟
الحروف هي إختصار HyperText Markup Language، وهي ليست لغة برمجية بالمعنى المتعارف عليه للغات البرمجة، ولكنها لغة أو طريقة لوصف محتويات صفحة الويب لبرامج التصفح، حيث أن أي برنامج متصفح انترنت يحتاج لمعرفة محتويات الصفحة من عناوين ونصوص وصور وروابط و غير ذلك من مكونات صفحة الويب، حتى تتمكن من عرضها بالشكل الصحيح، ولغة الترميز HTML، هي اللغة الرئيسية التي يتكون منها أي موقع أو صفحة على شبكة الإنترنت.
وتتكون صفحة الويب من مجموعة من العناصر (Tags) أو تعرف كــ الوسوم، يكتب كل وسم بين (angle brackets) أو كما تسمى علامة أصغر من وعلامة أكبر ولا يقوم المتصفح بعرض هذه الوسوم، ولكن يقوم بعرض محتوياتها، وهناك نوعين من الوسوم.
ما هي أنواع الوسوم Tags؟
النوع الأول: وهو عبارة عن وسم يتم عرض محتواه مباشرة في صفحة الويب، مثال img و input
النوع الثاgي: وهو عبارة عن وسم يصف ما بداخله من نصوص ، وقد يحتوي هذا الوسم بداخله على وسم آخر كعنصر وسوف تلاحظ في هذا النوع أن كل وسم يتكون من جزئين (وسم البداية) و (وسم النهاية) وبينهما المحتوى الذي يتم عرضه في المتصفح.
كيفية إنشاء صفحة ويب
نبدأ أولا بفتح برنامج notepad ثم من خلال القائمة File نقوم بحفظ الملف عن طريق إختيار الأمر Save As، وبعد ذلك سوف تظهر نافذة نكتب في خانة (إسم الملف - File Name) أي إسم من إختيارك فليكن مثلا test.html ويجب كتابة إسم الملف مع إمتداد الملف ولكتابة أكواد HTML يجب أن يكون إمتداد الملف إما (.html أو .htm) و في النافذة من الخانة Save as type سوف نختار All Files وفي خانة (Encoding) سوف نختار UTF-8 وذلك لكي يدعم الملف كتابة اللغة العربية ثم نضغط Save، والشكل التالي يوضح الخطوات بالتفصيل.
بعد إنشاء الملف ومعرفة المكونات الأساسية لعنصر من عناصر لغة الـ HTML سوف نبدأ بكتابة الأكواد الأساسية لإنشاء صفحة ويب (أو يمكنك نسخ محتويات المربع التالي في الملف) وبعدها سوف أشرح كل عنصر بالتفصيل.
ووظيفته أن يصف للمتصفح أن الكود المستخدم هو بلغة HTML، أما الوصف lang فوظيفته أن يصف للمتصفح أن محتويات صفحة الويب سوف تكون باللغة العربية، وذلك لأننا إخترنا القيمة ar أما إذا كان المحتوى باللغة الإنجليزية فيمكن أن تكون قيمة الوصف en. وقمنا بوضع وسم البداية (Opening Tag) في أول الأكواد وفي نهاية الكود كتبنا وسم النهاية (Closing Tag)، وبعد ذلك سوف نقسم الصفحة إلى قسمين رئيسيين أولهما ومحتوى هذا الوسم لا يظهر في المتصفح، ولكنه يحتوي على معلومات عن الصفحة وعن كيفية عرض محتويات الصفحة وذلك بإستخدام العناصر وثاني قسم في صفحة الويب وكل ما يكتب بداخل هذا الوسم هو ما يتم عرضه وتنسيقه من خلال المتصفح
ما هي لغة ترميز النص الفائق؟
لغة ترميز النص الفائق هي ليست لغة برمجيّة بل لغة وصفيّة (markup language) تعمل على وصف هيكلة محتويات صفحات الويب. تتألف لغة ترميز النص الفائق من مجموعة من العناصر (elements) تُستخدَم لاحتواء الأجزاء المختلفة من المحتوى لتجعله يظهر بطريقة معينة. فيمكن استخدام الوسوم المغلقة (enclosing tage)، مثلاً، لإضافة رابط تشعبي لكلمة أو لصورة يشير لموقع آخر، كما يمكن استخدامها لجعل الكلام مائل أو لتصغير الخط وتكبيره. لنأخذ النص التالي كمثال:
ماذا ستتعلم في كورس تصميم مواقع الويب و كورس html
مقدمة عن تصميم المواقع الالكترونية وأنواع المواقع وطرق تصميم المواقع
التعريف ببرامج تصميم المواقع المختلفة و مميزات كل منها
التعريف بلغة HTML المستخدمة في تصميم المواقع
شرحة بنية ومحتويات ملف HTML
شرح tags and containers
شرح انواع content models in HTML5
أساسيات HTML
شرح المسافات الفارغة والتعليفات في الكود
النصوص والفقرات
تنسيق الملف
اضافة صور الى موقعك
اضافة فيديوهات الى موقعك
اضافة صوتيات الى موقعك
استخدام block and inline tags
Displaying characters with references
Metadata and the Document Head
اضافة الاسكربتات للملف
استخدام الميتا تاج Meta Tag
طريقة تهيئة الصفحة لمحركات البحث
النصوص
HTML5
استخدام الجداول Tables
شرح وأستخدام أجزاء الجداول
Grouping columns
القوائم في لغة html
اضافة نوافذ مواقع اخرى الى موقعك
اضافة فيديوهات يوتيوب الى موقعك
التعامل مع ال input بمختلف اشكالها
صوتك مريح وشرحك هادىء لهيك بحب احضرلك وبتوصل المعلومه بكل سلاسه
عاوزين كورس ل css زي ده وجزاك الله خير❤️❤️
ايوه
@@enaizlyahous110 ايوة ايه ما هوا فيه اساسا كورس css !
@@shymmaahmed567 صح بس تصوير قديم
كان عندك بُعد نظر
مشفاهم عنده بعد نظر ليه@@vimosdimos3533
يديك الف عافية يا شيخ انت افضل من المدرسين عندي في جامعة استوكهولم للعلوم والتكنلوجيا، اللي ما يشرحوا لنا بهذي الطريقة .
ما شاء الله والله لم اجد بعض هذه المعلومات الا عندك والحمد لله
الفضل لله وحده و بالتوفيق في اللي جاي
@@AbdelrahmanGamal انشاء الله
اللهم اجعلنا شافعين لك ، فيديوهاتك أختصرت فيديوهات اليوتيوب كامل من حيث كل لشي والله ، الله يحفضك ويوفقك وين ماكنت ، جيل وراء جيل بيدعي لك ، يمكن تدعمم وماتشوف تعليقي بس حبيت اعبر الي بقلبي واقلك والله انك مبدع بمعنى الكلمه وان شاء الله تشوف تعليقي شكراً عبدالرحمن جمال ❤❤❤❤❤❤❤❤.
مشكور على مجهودك ترى نزلت على فيديوهاتك واحد ورا تاني شرحك مره حلو .واتمنى تستمر⚘
تسلم ياعبدالرحمن وجزاك الله كل خير على مجهودك وتعبك فى توصيل المعلومه بكل بساطه وسهوله .. عاااش والله
جزاك الله كل خير اخي الكريم والله يجعله في ميزان حسناتك ويعلي من مراتبك وشانك يارب نستفيد كثيرة من قناتك .... لك كل الاحترام والتقدير تلميذتك من بلجيكا💚🙏🍀
ممكن سؤال هو لما اضغط عالsubmit مبتنبعتش ليه
عندي لما عملت inbout type number كتب حرف الe بالرغم من ان ظهر الاسهم واتكتب ارقام بي وباقي الحروف مش كتبت احل المشكله ازاي هل حصلة مع حد تاني وا انا بس ؟
احسن قناة اتابعها منذ اول استعمالي اليوتيوب
شكرًا أستاذ على الشرح الأكثر من رائع🥺 احنا متفوقين بسببك بعد الله❤ ربي يسعدك
انا ماليش علاقه بالبرمجه ومش بعرف حاجه في الانجليزي لاكن اتعلمت منك كتير وخد منك الفكره الصح واستنتج المعلومات المفيده
جميل جدا بارك الله فيك
سويتها باقي التكرار لحتى ترسخ بالعقل😘😘
جزاك الله خير عن كل حرف اتعلمناه منك وربنا يوفقك للتقدم دايما
ربنا يجعله في ميزان حسناتك يارب
جزاك الله كل خير / شرح أكثر من رائع
شكرا الك كتير يا احمد ممكن تنزلنا كورس الcss
من سوريا ❤️❤️🇸🇾🇪🇬
جزاك الله خيرا
شكرا كتير الك بس انا عندي زرار ال submit كتبت متل ما انت قلت بس لما اكبس sumbit ما بيتم ارسال المعلومات وجربت اكتر من مرة
اني هم ما يطلعلي
اعاني من نفس المشكل
وانا كمان نفس المشكلة
اخي اعرف انو هذا الزرار يشتغل فقط اذا كان المشروع مرفوع على الانترنت
حضرت كورسات كتير على اليوتيوب لكن ماشفت حدا بشرحك زيك... الف الف شكر ليك... ياريت تعملنا كورس عن سي شارب
صراحه أبدعت في form
you are the best of the best legend is you thank u soo much for this >>>>
بسم الله ماشاء الله عليك
شرحك احسن من دكتور الجامعة
الله يوفقك
الله ينور... ياريت كورس انجولار وتايب اسكريبت
ممتاز ماشاء الله ..... ياريت شرح للفورم جروب
thanks for your time, really you are the best
رائع يا هندسه 🌸🌸
استفدت كتير برافو
thanks
في ميزان حسناتك يارب
اتعلمت كتير من حضرتك 🌹
شكرا جزيلا لك. لكن هذا الفيديو فيه كمية معلومات كثيرة
الله يجزاك خير
جزاك الله خيرا♥
very good thank you so much
انا عندي مشكلة الsubmitمايشتغل لما اضغطه مايرسل بيانات حد يساعدني
عرفت حلها ؟
@@i_SHOOG انا تخطيت هذا الدرس وكملت اللي بعده لاني زهقت وانا ادور ومالقيت😢
@@mohamadgeming3942 بس حتى برضوا الدروس جايه نفسه
بسالك انت ايش وظيفتك الحاليه ؟ اذا موظف
يصديقي ضروري الكود كله يكون بين تاق الform
يعني
@@makeaction370 انا عملت كدا ويظهر لدي لكن لما اضغط submit لاترسل البيانات
الله يسعدك ❤
good job bro👏
الله يجزاك الخيرررررررررررر
رائع جدا بتوفيق
بارك الله فيك
can i put be place
جميل جدا جدا 😊
والله معلم🧐🧐🧐🧐
ماذا لو عملت ذلك بدون وسم ال form
جزاك الله خير بس عندي سؤال الان انت مثلا لما تضع الماوس بعد علامة= بين النقطتين تظهر لك خيارات لما وضعته عند type انا لما اضع الماوس ما تظهر لي خيارات كيف اخليها تظهر ؟
وشكرا
الف شكر لحضرتك
السلام عليكم
كيف أجعل الفورم يحتفظ بالبيانات حتى بعد عمل Refresh
حفظك لله
احسنت 💐
بعض الاوامر لا تعمل وش ممكن تكون المشكلة ؟
greaat
😘
Thank you
وينك من زمان يا حياتي
❤❤❤
👏👏👏👏👏
شرح كتر حلو
اشمعنى في for attribute محطيناش # مع ال id زي ال link ?
رائع
هل ال placeholder تغني عن ال label ؟
لا دي الها استخدامات ودي الها استخدامات
شكراااا
شرح جميل جزاك الله اخي
طيب اخي البيانات دي تنبعتلي فين لو انا عايز اعمل نظام حسابات
TNice tutorials is simply A to Z on soft
عايز اظبطها بال css وجزاك الله كل خير
البيانات فين تروح ؟
اشمعناا في id هنا مرادي مستخدمتش # مع انك منبه عاليها
نفس السؤال عندي
ولكن اعتقد ان استخدام الهاش بيكون لو عاوز اعمل لينك او انتقال
في نفس الصفحه او صفحات او اميل اخر
يعني الهاش في الانتقال مش الربط والله اعلم
هو استخدم # دي في href مش مع id ال id كتابة نفس الكلمة علشان يربط الكودين ببعض
10:30 السلام عليكم
لما اجي اربط id و for. وادخل علي browser واجي ادوس علي الكلمة بيظهري علامة text select ومش بيضغط علي الكلمة حد يعرف حل
شكرا مقدما
كيف اسوي عرض لكلمة السير او اخفيها
Great
sign in
password
email
How l can l put my
❤
☑
يوم اسوي submit
مايبعتلي username و password
تبقا زي ماهي ليش؟
حصلت معايا وكنت ناسيه اكتب input داخل وسم
سكر الموقع كامل ارجع افتحو انا هيك سويت و ضبطت معي
#️⃣1️⃣5️⃣✅
انا عملت اصغر موقع في العلم مكون من ٢٢ صطر بس😊
انا لسة بادئ
لما اضغط على enter ما يرسل هل فيه احد مثلي ؟
انا ايضا
اسم البرنامج ده ايه
Visual Studio Code
سوال هل يصير استخدم pre لنزول الباس ؟
ممكن مساعدة*******
فى افكار شيطانية بدور فى دماغى بعد الفديو دة 😂
ليه😂
@@alaauchiha4905يسرق حسابات
جزاك الله خيرا
شكرا
انا عندي مشكلة الsubmitمايشتغل لما اضغطه مايرسل بيانات حد يساعدني
جزاك الله خيرا
Thanks