| |||||
| http://www.swalif.net/swalifsoft/ubb...ML/000038.html ------------------------------------------------------------------- بسم الله الرحمن الرحيم السلام عليكم ورحمة الله و بركاته درس للمبتدئين في HTML -------------------------------------------------------------------------------- لقد قمت بكتابة هذا الدرس من خبرتي الشخصيه وقد إستعنت ببعض الكتب لكي لاأقوم بتأليف .. وتجنبت إستخدام تعريب المصطلحات لأنه لايوجد تعريب مثالي في نظري إلى هذا الوقت . -------------------------------------------------------------------------------- أولاً : ماهو HTML ؟ هواختصار لـ Hyper Text Markup Language أي لغه ترميز النصوص التشعبيه . ماهو مستند HTML ؟ هو ملف نصي عادي ينتهي بالإمتداد xxx.HTML أو xxx.HTM ويحتوي على مجموعه من الوسوم ( Tag ) ممايتألف الوسم ؟ الوسم هو الكلمه المحاطه ب (> ) و (< ) ويكون عادة لكل وسم فتح وسم إغلاق لكن وسم الإغلاق يكون قبله شرطه اماميه (/) مثل وسم فتح الأسود العريض <B> ووسم إغلاقه <B/> -------------------------------------------------------------------------------- الوسوم ( Tag ) الرئيسيه ؟ وسم HTML : هو أول وسم يجب أن تكتبه في مستند HTML ووظيفته جعل المستعرض يعامل النص على أنه مكتوب بلغة HTML وأغلب المستعرضات الحاليه يمكنها العمل من دون هذا الوسم ولكن يفضل كتابته . لإستخدامه ضع <HTML> في بداية المستند و ضع <HTML/> في نهايته . وسم HEAD : يحتوي على عنوان الصفحه وبعض المعلومات التي لن تظهر للمستخدم وسم الفتح هو <HEAD> ووسم الإغلاق <HEAD/> . وسم TITLE : هو عنوان الصفحه .. وعنوان الصفحه هو ذلك النص الذي سوف يظهر شريط عنوان المستعرض ( الشريط الأزرق فوق شريط القوائم ) يمكنك حصر العنوان بين هذين الوسمين <TITLE> العنوان هنا <TITLE/> وسم BODY : المنطقه المحصوره بين <BODY> وبين <BODY/> هي المنطقه التي تحتوي على محتويات المستند . -------------------------------------------------------------------------------- قد يكون الكلام السابق كله مثل الألغاز لن تفهمه تماماً إلى بعض التطبيق وهذا مثال عملي على ماسبق : 1- افتح برنامج الدفترNotPad . 2- اكتب النص التالي : <HTML> <HEAD> <TITLE> صفحه تجربة </TITLE> </HEAD> <BODY> السلام عليكم ورحمة الله وبركاته </BODY> </HTML> 2- إحفظ الملف بإسم TEST.HTM . 3- قم بتشغيل الملف بالضغط عليهمرتين . -------------------------------------------------------------------------------- للدرس بقيه ...... إذا رأيت أنه يوجد ماهو غامض في هذا الدرس أو أنك لم تفهم نقطه ما لاتذهب بعيداً عن لوحة المفاتيح.... -------------------------------------------------------------------------------- -------------------------------------------------------------------------------- إلهي لاتعذبني فإني مقر بالذي قد كان مني Nasa Baby nb@jta4arab.net ------------------ Nasa Baby nb@jta.cjb.net http://jta.cjb.net | |||||
|
| |||||
|
تصدقوا شجعتوني أكمل  الدرس الثاني درس للمبتدئين في HTML -------------------------------------------------------------------------------- الدرس الثاني : وسوم تنسيق الأحرف & وسوم تنسيق الأسطر & سمات المحاذه ووسومها & وسوم الصور & وسوم الإرتباطات التشعبيه أعتمدت في هذا الدرس كثيراً على الكتب التاليه : DHTML لـ وليم ج / تعلم لغة HTML لـبروس موريس -------------------------------------------------------------------------------- مراجعه سريعه : البنيه الأساسيه لملف HTML هي كالتالي ( يمكنك مراجعتها في الدرس السابق ) <HTML> <HEAD><TITLE>عنوان الصفحه </TITLE></HEAD> <BODY> السلام عليكم </BODY> </HTML> -------------------------------------------------------------------------------- وسوم تنسيق الأحرف : توجد عدة وسوم لتنسيق الأحرف ومن أشهرها هذا الوسم <B> ووسم الإقفال الخاص به <B/> وهذا الوسم يجعل النص الموجود داخله بالخط العريض (هكذا ) ومن الأوسمه أيضاً <I> و <I/> وهو لجعل النص مائل ( هكذا ) وهذا الوسم <U> و <U/> لجعل النص تحته خط ( هكذا ) و <STRIKE> للشطب ( هكذا ) . اكثر وسم يستخدم لتنسيق الأحرف هو <FONT> وهو لتغيير لون النص و نوعه و حجمه .. ملاحظه : السمه .. تابعه للوسم وهي تحدد خصائص الوسم و تسمى أحياناً بارامترات مثال <FONT SIZE=3> هنا SIZE هو سمه و FONT هو وسم . يحتوي الوسم FONT على ثلاث سمات مهمه هي Face لتحديد نوع الخط و Size لتحديد حجم النص و COLOR لتحديد لون النص ( لاتقلق سوف نجري تجربه على كل سمه وكل وسم هنا ) السمه SIZE يمكنك ضبطها بقيمه بين 1 إلى 7 . -------------------------------------------------------------------------------- مثال : اكتب هذا الكود في محرر النصوص وسجلها ....( طويل شوي .. تحملونا ) <HTML> <HEAD><TITLE>تجربه على وسوم تنسيق الأحرف </TITLE></HEAD> <BODY> <B>هذا النص سوف يظهر بخط عريض</B> <I>هذا النص سوف يظهر بخط مائل</I> <U>هذا النص سوف يظهر بخط مسطر</U> <STRIKE>هذا النص سوف يظهر وهو مشطب</STRIKE> <B><I><U>هذا النص سوف يظهر بخط مائل و مسطر و عريض </B></I></U> <FONT FACE=Tahoma SIZE=4 COLOR=blue> هذا النص سوف يظهر بخط تاهوما وبلون أزرق و حجمه 4 </FONT> </BODY> </HTML> النتيجه : غالباً مماثله للتالي هذا النص سوف يظهر بخط عريض هذا النص سوف يظهر بخط مائل هذا النص سوف يظهر بخط مسطر هذا النص سوف يظهر وهو مشطب هذا النص سوف يظهر بخط مائل و مسطر و عريض هذا النص سوف يظهر بخط تاهوما وبلون أزرق و حجمه 4 تفصيل الكود : السطر الأول و الثاني و الثالث هي وسوم HTML الأساسيه السطر الرابع و الخامس و السادس و السابع هي تطبيق للنص العريض المائل المسطر المشطب بالتوالي .... أهم سطر هو السطر الثامن لاحظ كيف أننا جمعنا اكثر من وسم وطبقنا على جمله واحده وهذه تعتبر من مميزات الHTML حاول أن تتدرب على تطبيق أكثر من وسم على نص واحد مثل وسم الخط و الوسم العريض .. السطر التاسع هوو أيضاً مهم لاحظ كيف وضعنا السمات وكيف ضبطناها مع العلم لايجب أن تكون جميع السمات داخل الوسم مثل <FONT COLOR=red>نص احمر</FONT> ثم السطر العاشر وسم إقفال FONT و السطر الحادي عشر و الثاني عشر هي وسوم إقفال BODY و HTML -------------------------------------------------------------------------------- ملاحظه : لاتحاول حفظ جميع الوسوم فهي موضوعه بشكل بديهي يعني أن وسم الخط العريض لم يوضع B إلا إختصاراً لكلمة Bold وهكذا .. يعني إفهم ولاتحفظ .. إعتذار :لقد كنت على وشك شرح ( وسوم تنسيق الأسطر & سمات المحاذه ووسومها & وسوم الصور & وسوم الإرتباطات التشعبيه ) لكن رأيت أنها لن تفهم لو شرحت مع بعضها و ان حجم الرساله سوف يزيد بشكل غير متوقع لذلك سوف أقوم بشرح كل نوع من الوسوم في رساله ... والدرس القادم يوم الجمعه إنشاء الله .... -------------------------------------------------------------------------------- هل وجدت شيء غير مفهوم الم تفهم هذا الدرس هل واجهتك نقطه صعبه لاتتردد في كتابتها فقد أكون غفوت عن كتابة نقطه ما ... وجل من لايسهو اخوكم مازن مليباري ------------------ Nasa Baby nb@jta.cjb.net http://jta.cjb.net | |||||
|
 |
| أدوات الموضوع | |
| |
