|
![]() |
#1 | ||||||||||
![]() ![]()
|
![]() الدرس السادس فى لغة الـ HTML ... ![]() أهلا وسهلا بكم اعضاء و زوار منتدى عفوا ,,, لايمكنك مشاهده الروابط لانك غير مسجل لدينا [ للتسجيل اضغط هنا ] ,, سوف نتحدث فى درس اليوم عن الوصلات التشعبية .. ( الروابط , اللينكات , Links ) ,, ![]() مقدمة :- دعنى اطرح عليك سؤالاً فى البداية !! أولا كيف وصلت إلى هذا الشرح أو هذا الموضوع ؟ الإجابة بكل تأكيد ستكون ,,> عن طريق الإنترنت ... ولكن هذا ليس المقصود .. ! فالمقصود من السؤال هو كيف توصلت إلى هنا .. بكل بساطة فالإجابة هى ,, عن طريق الضغط على عدة روابط للانتقال الى هنا فعلى سبيل المثال .. عفوا ,,, لايمكنك مشاهده الروابط لانك غير مسجل لدينا [ للتسجيل اضغط هنا ] » عفوا ,,, لايمكنك مشاهده الروابط لانك غير مسجل لدينا [ للتسجيل اضغط هنا ] » عفوا ,,, لايمكنك مشاهده الروابط لانك غير مسجل لدينا [ للتسجيل اضغط هنا ] » عفوا ,,, لايمكنك مشاهده الروابط لانك غير مسجل لدينا [ للتسجيل اضغط هنا ] *-.-**-.-**-.-**-.-**-.-**-.-* هذا هو المقصود فى درس اليوم الروابط او الانتقالات عبر الانترنت وتسمى هذه الانتقالات بالوصلات التشعبية .. ![]() هناك عدة خيارات للوصلات التشعبية , منها أن تكون الوصلة لموقع آخر أو أن تكون لصفحة أخرى داخل الموقع نفسه ومنها أن تكون لمكان آخر في نفس الصفحة ( إلى أعلى أو أسفل على سبيل المثال ) أو أن تكون وصلة لعنوان بريد إلكتروني E-mail وفي جميع الحالات فإن المبدأ واحد لكن تختلف بعض التفاصيل . وسوف نناقش كل شئ على حدى فى هذا الدرس باذن الله تعالى . ![]() دعونا نتعرف على الوسم المستخدم فى الوصلات التشعبية ,, فهو الوسم <A>___</A> وهو اختصاراً لكلمة Anchor وهذا الوسم له بداية ونهاية كما سبق ذكره .. ولكن هذا الوسم وحده لا يكفى لاضافة الروابط او الوصلات التشعبية فيجب ان نضيف له بعض الخصائص وسنتعرف عليها واحدة فالاخرى وسنبدا بالخاصية HREF ,, الحالة الاولى .... *-.-**-.-**-.-**-.-* و التي نحدد من خلالها الموقع الذي نريد الذهاب اليه , ويجب أن يكتب عنوان الموقع كاملاً بهذا الشكل .. كود بلغة HTML:
<A HREF="http://www.silkroad4arab.com/vb"></A> دعونا نرى هذا المثال للتوضيح اكثر ,, كود بلغة HTML:
<A HREF="http://www.silkroad4arab.com/vb">Silkroad4arab</A> كود بلغة HTML:
<HTML> <HEAD> <TITLE>My First HTML Page</TITLE> </HEAD> <BODY> HTML Guide By 3ashek El7ozn & Silkroad4arab Forum<BR> <A HREF="http://www.silkroad4arab.com/vb">Silkroad4arab</A> </BODY> </HTML> ![]() ![]() هل هذا كل شئ ؟ بالطبع لا ,, انظر الى هذا المثال ,,>> كود بلغة HTML:
Go To <A HREF="http://www.silkroad4arab.com/vb">Silkroad4arab</A> :) كود بلغة HTML:
<HTML> <HEAD> <TITLE>My First HTML Page</TITLE> </HEAD> <BODY> HTML Guide By 3ashek El7ozn & Silkroad4arab Forum<BR> Go To <A HREF="http://www.silkroad4arab.com/vb">Silkroad4arab</A> :) </BODY> </HTML> ![]() ![]() كما يمكنك اضافة صورة كوصلة تشعبية كما سبق ذكره فى عفوا ,,, لايمكنك مشاهده الروابط لانك غير مسجل لدينا [ للتسجيل اضغط هنا ] ,, ولكن لن اكتفى بالدرس السابق سأقوم ايضا بذكرها ثانية للتاكيد . دعونا نرى مثالاً على ذلك ... الصورة المستخدمة فى الشرح هى ,, ![]() كود بلغة HTML:
<A HREF="http://www.silkroad4arab.com/vb"><IMG SRC="logo.png" BORDER="0"></A> ![]() فقط قمت بتغيير لون الصفحة لان الصورة تحتوى على كلمات باللون الابيض ولكن يمكنك استخدام اى صورة تريدها فقط انا اقوم باستخدام الصورة الخاصة بمنتدانا ^^ ![]() اذا قمت بالضغط على الصورة سيتم تحويلك تلقائيا الى المنتدى بإذن الله .. كما يمكنك التحكم فى حجم الصورة وللقيام بكل هذا يمكنك العودة الى عفوا ,,, لايمكنك مشاهده الروابط لانك غير مسجل لدينا [ للتسجيل اضغط هنا ] .. ![]() الحالة الثانية .... *-.-**-.-**-.-**-.-* وهي أن تشير الوصلة التشعبية إلى وصلة موجودة في نفس الموقع وهنا سنقوم بعمل صفحة جديدة تستند الى الصفحة التى نقوم بالتعديل عليها فى كل مرة والتى كنا قد اطلقنا عليها الاسم 1st.html كما ذكرنا فى عفوا ,,, لايمكنك مشاهده الروابط لانك غير مسجل لدينا [ للتسجيل اضغط هنا ] .. ولنقوم بتسميتها 2nd.html ويكون محتواها باى شكل تريد وليكن مثل محتوى الصفحة الاولى , ولكن هذا للتوضيح فقط ليس الا . وسيكون كود الانتقال بهذا الشكل ,, كود بلغة HTML:
<A HREF="2nd.html">2nd Page</A> فسيتم فتح الصفحة فى نفس النافذة التى نحن فيها وليست نافذة جديدة New Tab .. *-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-* وهذه صور للتوضيح >> هذه الصورة تمثل الحالة الأولى والتى تحتوى على وصلة تشعبية لموقع خارجى . ![]() *-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-* اما هذه فهى تمثل الحالة الثانية والتى تحتوى على وصلة تشعبية لصفحة ما بداخل الموقع . *-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-* ![]() *-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-* ![]() *-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-* ويبقى تنبيه اخير بالنسبة اذا كان الملف الذى نريده بداخل موقعنا موجود بمجلد آخر داخل الموقع وليس المجلد الحالى فستحتاج للعودة الى عفوا ,,, لايمكنك مشاهده الروابط لانك غير مسجل لدينا [ للتسجيل اضغط هنا ] .. وهى تماما كما قمنا الشرح على الصور ,, ![]() الحالة الثالثة وتنطبق على الصفحات ذات المحتوى الكبير وتمكنك هذه الحالة من الانتقال إلى أعلى الصفحة أو آخرها ولكن بشرط تحديد بداية ونهاية الصفحة .. وهنا ياتى وقت استخدام الخاصية NAME والتى تقوم بتعريف مكان ما بداخل الصفحة باسم ما ,, لا تستوعب !! دعنا نرى مثالاً ,,>> كود بلغة HTML:
<HTML> <HEAD> <TITLE>My First HTML Page</TITLE> </HEAD> <BODY> <A NAME="startguide">HTML</A> Guide By 3ashek El7ozn & Silkroad4arab Forum<BR> <BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR> <BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR> <A HREF="1st.html#startguide">Start Guide</A> <A HREF="1st.html#endguide">END Guide</A> <BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR> <BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR> <A HREF="2nd.html">2nd Page</A> <BR> <A NAME="endguide">HTML Guide</A> By 3ashek El7ozn & Silkroad4arab Forum </BODY> </HTML> ![]() *-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-* وهنا ساقوم بالايضاح بشكل اكثر وهو اننا قمنا بتحديد كلمة ما من داخل نص الصفحة لدينا بانه بداية صفحتنا حيث انه مهما كانت كمية ذكاء الحاسوب فهو لن يستطيع اطلافا بان يقوم بمعرفة ما اذا هو بادية الصفحة او نهايتها وحده بدون تحديد !! فقد قمنا باستخدام , الخاصية NAME مع الوسم <A> فى بداية النص وقمنا بتسمية البداية باسم ما وليكن كما بالشرح وهو startguide ليكون الكود بهذا الشكل فى الكلمة المراد تحديدها كبداية لصفحتنا ,, كود بلغة HTML:
<A NAME="startguide">HTML</A> Guide By 3ashek El7ozn & Silkroad4arab Forum كود بلغة HTML:
<A NAME="endguide">HTML Guide</A> By 3ashek El7ozn & Silkroad4arab Forum ويتبقى طريقة عمل الوصلة التشعبية للبداية والنهاية وتكون بهذه الطريقة عن طريق استخدام الرمز ( # ) كما يلى ,, كود بلغة HTML:
<A HREF="1st.html#startguide">Start Guide</A> كود بلغة HTML:
<A HREF="1st.html#endguide">END Guide</A> ![]() ويتبقى خاصية اخرى تستخدم مع الوسم <A> وهى MAILTO ووظيفتها هى ادراج وصلة تشعبية لعنوان بريد الكترونى . وتكون بهذا الشكل ,,>> كود بلغة HTML:
<A HREF="MAILTO:[email protected]">Mail To 3ashek El7ozn</A> فقد لاحظنا أننا استخدمنا كلمات مفتاحية ميزت طبيعة هذا العنوان , وأعطت المتصفح فكرة عن طبيعة التعامل مع هذا العنوان وطريقة الاتصال به . فعندما كتبنا عنوان Email استخدمنا كلمة MAILTO قبل هذا العنوان , وبالتالي قمنا باعلام المتصفح بفتح برنامج البريد الإلكتروني الافتراضي وتجهيزه لإرسال رسالة إلى العنوان المدرج , بعكس التوصيل إلى عنوان خارجي سواء كان لموقع ويب خارجى او صفحة داخلية فكلمة HTTP والتي تدل على نوع البروتوكول المستخدم في الاتصال بهذا الموقع , وهو بروتوكول نقل النصوص المتشعبة Hyper Text Transfer Protocol . ![]() والى هنا اكون قد انتهيت من درس الوصلات التشعبية,, ![]() وفى النهاية *-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-* هذا عمل بشري ,, لا يخلوا من الأخطاء , فإن أصبت فمن الله .. وإن أخطأت فمني ومن الشيطان . *-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-* وعند النقل يرجى ذكر المصدر دمتم بود *-.-**-.-**-.-**-.-**-.-**-.-**-.- ![]() |
||||||||||
![]() |
![]() |
#2 | ||||||||||
![]() ![]()
|
![]() ![]() ![]() ![]() |
||||||||||
![]() |
![]() |
يتصفح الموضوع حالياً : 1 (0 عضو و 1 زائر) | |
|
|