تفاصيل أكثر عن نماذج HTML
إستكملت عدة مواضيع سابقة تتحدث عن النماذج في XHTML/HTML وتطرقنا فيها إلى كتابة النماذج ثم تنسيق النماذج البريدي وأخيراً إلى تطبيق واحد حول هذا الموضوع، ويمكنك الرجوع إليها عبر هذه الروابط:
- النماذج في XHTML – الجزء الأول
- النماذج في XHTML – الجزء الثاني
- درس CSS: تنسيق نموذج بريدي
- تطبيق على درس النماذج + إستخدام Javascript
اليوم سنتحدث أكثر عن بعض الأفكار حول نماذج html، سندخل في تحديد نمط تصميم نموذج HTML إضافة إلى نماذج مشهورة على الويب من المواقع العالمية، وبعد ذلك أفكار سريعة حول النماذج تتكون من أمثلة وحلول لبعض المشاكل التي تواجه المصممين في تنسيقهم لمناذج HTML.
تطبيق على درس النماذج + إستخدام Javascript
هذا الدرس تطبيق للدرس السابق حول تنسيق النماذج ، ولكن سيكون عملي أكثر بشفرة HTML و CSS وأيضاً إستخدام Javascript في إضافة ميزتين للنموذج ، وهما ملاحطة حول الحقول المهمة بمجرد الضغط على الحقل (بإستخدام الحدث onFocus و onBlur ) وأيضاً التأكد من الحقول المهمة التي نسقناها ، سأحاول شرح النقاط المهمة في الدرس مع وجود مثال قبل قراءة الدرس وإن أعجبك تستطيع أيضاً تحميل ملف الدرس.
- مثال على الدرس (التأكد عن طريق النوافذ)
- مثال على الدرس 2 (التأكد عن طريق إضافة تعليق بجانب الحقل وتغيير لون الحقل والنص إلى اللون الأحمر)
- تحميل الأمثلة

درس CSS: تنسيق نموذج بريدي
هذا الدرس تابع لآخر درسين كتبتهم حول النماذج في XHTML وسأكمله عبر هذا الدرس كما هو واضح من العنوان كيفية تنسيق نموذج XHTML ، بالنسبة للنماذج كما نعلم فإن تقسيم الحقول إلى مجموعات يتم عبر الوسم fieldset ، يمكنك إستخدامه مرة واحدة متضمناً عدة حقول وأيضاً متضمناً مجموعة آخرى لحقول آخرى ، هناك أكثر من طريقة تستطيع تنسيق النموذج كما يحلو لك وبدون إستخدام الأوسمة fieldset ، legend ، label .. هذا إذا أردت عمل شيء بسيط وسريع ولكن فضلنا إستخدام كتابة النماذج بطريقتها الأساسية كما بيّنت في الدروس الماضية حول النماذج ، نسقها مثل ما تريد سأوضح فقط بعض الطرق المستخدمة إضافةً لنمطين قمت بتصميمهم كمثال.
النماذج في XHTML – الجزء الثاني
ذكرنا في الجزء الأول من حديثنا حول النماذج في XHTML طريقة كتابة النماذج ومحتوياتها وركزنا على حقول من الوسم input مع بعض خصائصها المهمة ، سنفصل أكثر في الحقول وأنواعها وإنشاء المساحات النصية ، وعمل قائمة الإختيارات مع بعض الملاحظات التي سنذكرها في نهاية الموضوع.
.. أكمل قراءة بقية الموضوع »
النماذج في XHTML – الجزء الأول
موضوعنا اليوم يتحدث عن النماذج(Forms) في XHTML ، النماذج لها إستخدامات كثيرة في الصفحات مثل نموذج مراسلة ، نموذج تسجيل أو تسجيل دخول ، .. إلخ .. سنتحدث عن كيفية كتابتها في XHTML وخاصة الأوسمة المتعلقة بها التي تستطيع عمل عناصر عن طريقها.
عند عمل نموذج في XHTML يكون ذلك في البداية عن طريق الوسم form والذي سيحتوي على بقية محتويات النموذج هناك طرق أسهل لعمل النماذج ولكن سنخصص هذا الموضوع بالتفصيل قليلاً سنشرح الخصائص المتعلقة بكل وسم نريده وأشكال لنماذج وكيفية عملها بإستخدام CSS ( سيأتي لاحقاً).
.. أكمل قراءة بقية الموضوع »
