موضوع: تصميم موقع html السبت يناير 01, 2011 10:07 am
بالبداية حـاب أقـول أن لغـة Html ليست لغـة صعبة لا بل انها أسهـل لغـة برمجـة لتصميم صفحات أنترنت على الاطلاق فهي لا تحتاج إلى أن تكون ذو خبرهـ وخلفيه كبيرهـ بها فقط كل ماعليك أن تعلمه " علامـات " لغة html الاساسيه ومن ثم تستطيع أن تصمم صفحة أو موقع على الشبكة بيسر وسهول و تستطع أن تصمم صفحة ومواقع بكل سهوله عن طريق عدة برامج كالورد أو (( المفكرهـ )) سوف يكون شرحي هنا عالمفكرة أفتح المفكرهـ الآن وقم بنسخ العلامات التالية فهي علامات أساسيه لجسم ولغة html أما باقي العلامات وهي كثيرهـ فهي ثانوية تحسينيه تحتاج آليها ولا شك فيما بعد ولكن بمجرد أن تضع العلامات الرئيسية بالمفكره وتقوم بحفظ المفكره بأي أسم وتجعل اللحقة لها html سوف ترى الصفحة أنشت بسرعة البرق وبلا تكلف طريقة حفظ المفكره ضع أي اسم مثلا " عامر " فلابد أن تجعل اللاحقه هكذا عامر . html وبعدها سوف تراها تحفظ بشكل الاكسبلورا متصفح الانترنت وفي حين فتحت هذا المتصفح سوف تفتح لك صفحتك بكامل التنسيقات والكلمات التي وضعتها من قبل بالمفكرهـ هنا العلامات الرئيسية <HTML> <HEAD> <TITLE>عنوان صفحتي</TITLE> </HEAD> <BODY> </BODY> </HTML> باديتا ً اقول كل كلمة بين الاقواس كما ترون تسمى " علامـه " أو بالانجليزية تـاق ولو لاحظتوا أن العلامة تتكرر مرتين فمثلا ً <HTML> </HTML> تكررت مرتين ولكن بالثانية أضيف لها (/) فالاولى تمثل علامة فتح والآخر التي فيها / تمثل علامة أغلاق فلا بـد أن نضع علامة فتح وأغلاق هذا ضروري كما تشاهدون وعلامـة <HTML> هي الرئيسية التي نضح كل شي بوسطها كما نرى بالتعليمه أعلاهـ أما علامـة <HEAD> فهي للعنوان دائما ً فالعنوان يوضع بداخلها بين علامتي <TITLE> كما بالمثل وسوف يظهر العنوان بالاعلى بشريط العنوان وليس بالصفحه نفسها ونأتي الآن للعلامة المهمه وهي <BODY> هذه ِ العلامة هي التي نضع النصوص بداخلها مثلا ً كلمة الموقع أو أي شي تريده يظهر بصفحه الموقع ضعه في داخل علامة <BODY> الفتح وعلامة الـ </BODY> الاغـلاق وبالنهاية نضع علامـة </HTML> الاغـلاق ونقوم بعد الانتهاء من التنسيقات و الكتابة من قائمه ــ ملف ــ حفظ وبعدها نفتحها من شكل الاكسبلورا وسوف نرى كل مافعلناهـ واقعا ً على صفحة <HTML> هذه ِ بلمحة سريعـة عن هـذه ِ اللغة أيضا ً هنالك تنويـه أن اللغة ليست أسمها الهوتميل لا بل أنها تنطق حرف حرف مثل h t m l كما أن أغلب العلامات الاضافيه تضع مع علامة <BODY> مثلا ً لو أردت أن تضع لون للنص أو تضع صورة أو أن تميل النصوص أو تزيح النصوص وتعمل لهم ملائمه على سبيل المثال لو أردت أتجعل صفحتك او موقعك ذو لون معين ماذا تفعل هنا الحل : نذهب إلى التعليمه من جديد ونذهب إلى علامة <BODY> ونضع اللون معها بالشكل هذا <BODY ****="red" > بهذا الشكل سوف يكون لون النصوص (( أحمر )) كوننا أخترنا اللون الاحمر ولك ان تختار أي لون بهذه ِ الطريقة . ولو أردنا أن نضع لون للخلفية بإكملها: < bgcolor="blue" BODY> ولو أردت أن تضع رابط بالصفحه أو الموقع : <BODY BACKGROUND="http://www.qassimy.com/vb/"> فقط ضع الرابط هكذا وهنا انا وضعت رابط موقعنا وهذا الرابط لا يفضل أستخدامه كونه سيجعل الصفحة أو الموقع بإكمله أرتباطا ً تشعبي لو ضغطت على أي مكان بموقعه بصفحةhtml مباشرة سوف يحولك إلى الموقع الذي وضعت الرابط له مثل هنا سوف يحولنا إلى قصيمي نت ولو أردت أن تعمل ملائمة لنص معين تجعله باليمن أو باليسار أو بالوسط : <bODY VID align="center"> هنا وضعنا الملائمه للنص بالوسط تجعل النص بالوسط وتستطيع أن تبدل كلمة سنتر إلى اليمين أو اليسار حسب رغبتك طعبا ً تستطيع أستخدام علامة <VID align="ضع ماتشاء يمين يسار وسط "> بدون علامة البدي مثلا ً لو أردت أن تجعل جملة باليمين فقط دون البقية تضع العلامة فوق الكلمة المختاره وتحتها علامة الاغلاق <VID/> هنا أيضا ً بعض العلامات : link="ضع أي لون" وطيفتها : وضع لون للنك أو الروابط النشطه بالموقع vlink="ضع أي لون" وظيفتها : وضع لون للنك أو الرابط الذي تم زيارته من قبلك alink="ضع أي لون" وظيفتها : وضع لون للننك أو الرابط الذي لم تزرهـ وجميع ماذكر يستخدم بتعليمه <BODY> دون تقسيم أي اننا قسمنا كل شي على حدى فقط للشرح وللسهوله ولكن هي بالوقع توضع مجتمعه دون تقسيم هكذا : < BACKGROUND="http://www.qassimy.com/vb/ bgcolor="blue" VID align="center BODY ****="red> قد تراهـا معقـده ولكن بالاساس هي ليست معقده وكما قسمناهـا بالاعلى فقط وضعناهم جميعا ً مع بعض كل واحدهـ تلو الآخرى دون تقسيم أيضا ً هنالك بعض العلامات تستطيع أستخدامها مثل : <hr> وهذه ِ دون علامة أغلاق فقط هكذا تكتب وظيفتها : تعطينا خط أفقي هكذا ــــــــــــــــــــــــــ <br> أيضا ً تكتب لوحدها دون علامة أغلاق و وظيفتها هي ( إلتفاف للنص ) ومن دونها سوف يكون السطر متصل ولن ينثني للسطر الثاني مهما فعلت حتى لو ضغت أنتر راح ينزل السطر ولكن حين حفظها ستتفاجأ بوجوده على سطر واحد <p> مرحبا ً بكم معنا نحن نودكم فياهل قلوبكم تودنا عاجبتني هالجملة تو جايبها عالطاير اليوم أنا أبشرح بعض العلامات وتصدقون أني ماخذ كل العلامات اللي بالصفحة الرئيسية للمنتدى <p/> أنظر إلى الجمل في داخل العلامة لو وضعناهم هكذا سوف يكونون كجمله واحده ولكن لكي نجعل كل جملتين منفصلتين عن الآخر نضع العلامة بالشكل التالي <p> مرحبا ً بكم معنا نحن نودكم فياهل قلوبكم تودنا عاجبتني هالجملة تو جايبها عالطاير <p/> اليوم أنا أبشرح بعض العلامات وتصدقون أني ماخذ كل العلامات اللي بالصفحة الرئيسية للمنتدى بهـذه ِ الحالة سوف تكون الجملتين بالاعلى منفصلتين عن الجملتين بالاسفل وبينهم خط سطر فاضي كإنهم تعبيريين مختلفين . علامـة <h1> </h1> وظيفتها حجم النص تضع العلامة بالبدي بين أي جملة كيف ماشاءت العلامه هذه ِ تعطينا حجم للنصوص ولو لاحظت رقم 1 داخل العلامة هذا يعني أن الحجم الذي اخترته للنص كبير أي الحجم الاكبر وأذا أردت ان تجعله أقل حجم نضع بدل الــ (1) 2 أو 3 . . الخ . .
Admin (الفريق الأول)
المدير العام المساهمات : 1427 مشاركة "نقاط" : 11992 السٌّمعَة : 7 تاريخ التسجيل : 22/11/2010 الموقع : منتديات وش كمان