08-09-2014, 03:23 AM
|
#1
|
.:: ! HTML PROF ::.
|
|
• الانـتـسـاب » Jun 2010
|
|
• رقـم العـضـويـة » 71305
|
|
• المشـــاركـات » 5,583
|
|
• الـدولـة » Egypt
|
|
• الـهـوايـة » <HTML>
|
|
• اسـم الـسـيـرفـر » Private Server
|
|
• الـجـنـس » Male
|
|
• نقـاط التقييم » 177
|
|
|
 
|
.gif)
تعلم HTML : دورة احتراف لغة الـ HTML من الالف الى الياء ( الدرس الأول ) .
الدرس الأول فى لغة الـ HTML ...
أهلا وسهلا بكم اعضاء و زوار منتديات عفوا ,,, لايمكنك مشاهده الروابط لانك غير مسجل لدينا [ للتسجيل اضغط هنا ] ,,
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
سوف نقوم فى هذا الدرس بسرد الوسوم الأساسية لصفحة الويب وتعريفها واحدة تلو الاخرى لنتوصل فى نهاية هذا الدرس المتواضع إلى انشاء صفحة ويب بسيطة تقوم انت كـ مبتدئ فى لغة الـ HTML بعملها بنفسك وبدون اى مشاق .
الوسوم الأساسية فى اى صفحة ويب صنعت بـ لغة HTML .
وسم البداية
وسم النهاية
وسم البداية
وسم النهاية
وسم البداية
وسم النهاية
وسم البداية
وسم النهاية
وكما اتفقنا سابقا فى عفوا ,,, لايمكنك مشاهده الروابط لانك غير مسجل لدينا [ للتسجيل اضغط هنا ] ان لكل وسم بداية ونهاية ,,
اقتباس:
المشاركة الأصلية كتبت بواسطة 3ashek El7ozn
عفوا ,,, لايمكنك مشاهده الروابط لانك غير مسجل لدينا [ للتسجيل اضغط هنا ]
ومن ما سبق يجب ان نكون على يقين بان لمعظم الوسوم بداية ونهاية لنفس الوسم والفرق بينهما هو العلامة ( / ) سلاش ..
|
وفيما يلى منظر مبسط عن المظهر العام لصفحة الـ HTML .
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
كود بلغة HTML:
<HTML>
<HEAD>
<TITLE> </TITLE>
<HEAD/>
الى هنا يتم وضع عنوان الصفحة و معلومات خاصة عنها كالمحتويات والوصف .... الخ
------------------------------------------
<BODY>
هنا توضع محتويات الصفحة
كـ نصوص و جداول و صور و روابط تشعبية .... الخ
------------------------------------------
<BODY/>
<HTML/>
ماذا نستنتج من هذا النموذج المبسط ؟؟؟
1- اى ملف HTML يجب ان يبدا بـ الوسم <HTML> كما يجب ايضا ان ينتهى بـ الوسم <HTML/> فتذكر ذلك دائما .
2- الوسم <HEAD> يحدد بداية المقطع الذى يحتوى على المعلومات الخاصة بالصفحة كالعنوان مثلا و الميتا تاج ( الكلمات الدلالية ) .
3- يوجد بين الوسمين <HEAD> و <HEAD/> الوسمين <TITLE> ___ </TITLE> وهذان الوسمان يوضع بينهما اسم الصفحة الذى يظهر فى شريط عنوان المتصفح امام المستخدم ,, كما يجب انهاء المهمة بالوسم <HEAD/> .
4- اما عن الوسم <BODY> فهو المكان المخصص لسرد محتويات صفحة الويب من روابط تشعبية وصور وجداول ...... الخ ,, كما يجب انهاء تلك الوسم ايضا بـ <BODY/> .
والآن بعد ان تفهمنا الوسوم جيدا هيا بنا اعزائى أعضاء , زوار منتدى عفوا ,,, لايمكنك مشاهده الروابط لانك غير مسجل لدينا [ للتسجيل اضغط هنا ] نقوم بتطبيق مثال بسيط عن ما تعرفنا عليه ..
قم بتطبيق ما فهمت فقط ولا تقم بنسخ الكود للتجربة  .
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
كود بلغة HTML:
<HTML>
<HEAD>
<TITLE>My First HTML Page</TITLE>
</HEAD>
<BODY>
HTML Guide By 3ashek El7ozn & Silkroad4arab Forum
</BODY>
</HTML>
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
بعد الانتهاء من تطبيق ما فهمت قم بحفظ الملف بـ أى اسم تختاره تحت صيغة html او htm ثم قم بفتح الملف لتجربة التطبيق هل نجح ام لا ..
النتيجة الإيجابية ,,
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
اذا لم تحصل على تلك النتيجة  عليك بمراجعة الدرس مجدداً ..
ملحوظة بسيطة ...
لا يوجد فارق بين الوسوم ذات الحروف الكبيرة و الصغيرة فكلاهما واحد حيث ~ >>
<HTML> = <html>
كما يجب عليك الاخذ بعين الاعتبار بان المتصفحات لا تتعامل مع الفراغات الزائدة بانها مسافات او فواصل او فقرات ودليل على ذلك ,,
كود بلغة HTML:
<HTML><HEAD><TITLE>My First html Page</TITLE></HEAD><BODY>HTML Guide By 3ashek El7ozn & Silkroad4arab Fourm</BODY></HTML>
كود بلغة HTML:
<HTML>
<HEAD>
<TITLE>
My
First
HTML
Page
</TITLE>
</HEAD>
<BODY>
HTML
Guide
By
3ashek
El7ozn
&
Silkroad
4
arab
Fourm
</BODY>
</HTML>
كود بلغة HTML:
<HTML><HEAD><TITLE>
My
First
HTML
Page
</TITLE></HEAD><BODY>
HTML
Guide
By
3ashek
El7ozn
&
Silkroad4arab
Fourm
</BODY></HTML>
كود بلغة HTML:
<HTML> <HEAD> <TITLE>
My
First
html
Page
</TITLE> </HEAD> <BODY>
HTML
Guide
By
3ashek
El7ozn
&
Silkroad4arab
Fourm
</BODY> </HTML>
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
ستكون النتيجة كالسابق فقم بالتجربة
والآن .. السؤال الذى يدور فى رأسك !
كيف اقوم بترك فراغ او تحديد نهاية سطر او البدء بفقرة جديدة ؟؟
الإجابة ,,
هى الوسم <BR> .
والآن نذهب الى المثال السابق ..
ونقوم بإضافة الوسم <BR> .
كود بلغة HTML:
<HTML>
<HEAD>
<TITLE>My First HTML Page</TITLE>
</HEAD>
<BODY>
HTML Guide <BR>By 3ashek El7ozn <BR>&<BR> Silkroad4arab Forum
</BODY>
</HTML>
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
النتيجة >>
كما هناك الوسم <P> والذى يقوم بنفس عمل الوسم السابق <BR> ولكن باختلاف بسيط الا وهو ترك سطر فارغ بين كل فقرة واخرى ..
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
كود بلغة HTML:
<HTML>
<HEAD>
<TITLE>My First HTMLl Page</TITLE>
</HEAD>
<BODY>
HTML Guide <P>By 3ashek El7ozn <P>&<P> Silkroad4arab Fourm
</BODY>
</HTML>
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
النتيجة >>
ناتى لنقطة اخرى وهى ترك فراغا بين الكلمات ..
والفراغات يتم استخدام الوسم معها .
و يعنى هذا الوسم Non Breakable Space
واذا اردنا ادخال عدة فراغات بين نص و آخر نقوم باضافة هذا الوسم بمقدار الفراغات المطلوبة ..
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
دعونا نرى مثالا حيا ,,
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
كود بلغة HTML:
<HTML>
<HEAD>
<TITLE>My First HTML Page</TITLE>
</HEAD>
<BODY>
HTML Guide By 3ashek El7ozn & Silkroad4arab Forum
</BODY>
</HTML>
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
النتيجة >>
بالمناسبة قمنا بالتحدث عن الرموز الخاصة مثل فهناك العديد من الرموز الخاصة وتكتب بصورة معينة سوف نتناول ذكرها فى درس لاحق ان شاء الله تعالى ..
وفى النهاية
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
هذا عمل بشري ,, لا يخلوا من الأخطاء , فإن أصبت فمن الله .. وإن أخطأت فمني ومن الشيطان .
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
وعند النقل يرجى ذكر المصدر
دمتم بود
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
|
|
|
|