الدرس الخآمس :: بعض الأوسام المهمة لتكميل جمالية الصفحة :: .. !

[xXJoKeRXx]

أهلا وسهلا بالجميع ... زوار دورة احتراف لغة ال HTML . . مية اهلا وسهلا فيكن

برغم انو ما تمت الإجاآبة عن الأسئلة في الدرس المآضي .. بس رح كمل الدورة معلش ^^


طرحت بالدرس المآضي جمالية الصفحة و أضافة بعض الخطوط عليها :) :: ... ! و إن شاء الله يكون الدرس كان بالسهولة المطلوبة ...

اليوم رح اطرح بعض الاوسام يلي بتخلينا نكمل الجمالية على الصفحة تبعنا .. و بتخلينا نعطيها التنسيق يلي بدنا ياه

طبعا ً الاوسام يلي رح نشوفها اليوم هية بتشمل اغلب الاوسام المتعلقة بالكتابة ... ^^ و جاية بالدروس القادمة الاوسام الأخرى ..

خلونا نخلص شغلة شغلة بس

---

بدي نبه على شغلة كــتير مهمة حبيباتي ....

انو رح تلاحظو تكرار بطبيعة العمل .. مع اختلاف الوسم .. ^^

شرحها اكتر يحيى ...

يعني رح تشوفو وجود الكثير من الاوسام و رح يكون الها نفس الأداء و نفس الشي و نفس الترجمة . . خلوها ببالكن هي

المهم يلا نبلش بالأوسام اليوم

---

هناك وسوم خاصة تستخدم لتمييز العناوين Headings في صفحات الإنترنت وهي:

<Hn> ... </Hn>

وحرف n هو رقم بين 1-6 يمثل مستوى العنوان.

<H1> Sa3eka 1 <‎/H1>
<H2> Sa3eka 2 <‎/H2>
<H3> Sa3eka 3  <‎/H3>
<H4> Sa3eka 4 <‎/H4>
<H5>Sa3eka 5  <‎/H5>
<H6>Sa3eka 6 <‎/H6>

رح تكون النتيجة


Sa3eka 1
Sa3eka 2
Sa3eka 3

Sa3eka 4
Sa3eka 5
Sa3eka 6

ونأتي الآن إلى التنسيقات والتأثيرات التي يمكن إضافتها إلى النصوص.
وفيما يلي الوسوم الخاصة بها بمثال ونتيجته:

* الخط الغامق (الأسود العريض)، ونستخدم له الوسوم التالية:

<b>
أو 
<Strong>

و هي مثآل مع الكود




و لآحظو أنو الوسمين كان الهن نفس النتيجة .. و رح نشوف انو في اكتر من وسم بيعطي نفس النتيجة

* الخط المائل ، و نستخدم له الاوسام التالية :

<I>
أو
<EM>

و هي مثآل مع الكود





*الخط المسطر ( يلي تحتو خط ) ، و يستخدم الوسم :

<u> </u>

هي مثآل مع الكود





*الخط المرتفع :) ^^ :

<sup> </sup>

المثال مع الكود






*الخط المنخفض :

<sub> </sub>

هي المثآل مع الكود






*خط ضخم و كبير :

<big> </big>

*خط صغيـر :

<small> </small> 

*نص يعترضه خط بالوسط :

<S> </S>
أو
<Strike> </Strike>

*نص الآلة الطابعة TeleType :

<TT> </TT> 

هلء عندي كم ملاحظة بدي احكيهن على هالوسم هادا ...


هالوسم هادا بيسموه موحَد المسافاتMonospaced Text يعني انا رح اطرحلكن مثآل عليه شوفو




شو فهمتو .. ؟



يآآآي ولا شي .!؟ اوكي ممتاز ..


هلء هادا الوسم .. إذا حطينا مثلا .. الحرف i عشر مرات و حطينا الحرف m كمان عشر مرات ..

رح نشوف الفارق الكبير يلي اخدو الحرف m يلي هو اضعاف المساحة يلي اخدها الحرف i ...

و لما مستنخدم الوسم <TT> ... رح يتم تحديد المسافة و توحيدها لكلا الحرفين


هلء خلصنا من الاوسام المهمة .. لتنسيق الصفحة ...

---

بدي كمآن نبه على شغلة مشان ما حدا يخربط ... و يقول انو كلامي مو صحيح ...


اخواني التنسيق بين الاوسام جدا ً مهم ..

شوفو الصورة و لحالكن رح تفهمو








اوكيز ؟ اهم الشي التنسيق بالاوسام ...


يمكن البعض ما يصدقني و يقول لأ انا جربتها من غير تنسيق و زبطت . . بس انا بقلو انو هي تعد خطأ برمجي . .
و انت لا تحسب الموضوع كأنك عم تكتب بصفحة وحدة

احسب عدد الاخطاء البرمجية لنفرض بموقع كبير . . مكون من المئات من الصفحات و الالاف و الملايين من الاوسام .. إي ولييي بتصير مصيبة وقتها ..

فهمانين .. ؟


اوكي لحد هون بكون انتهى درسنا ان شاء الله .. و كلعادة أي شي بدكن ياه لا يردك غير الكيبورد تبعك


تفضلوا اطرحو استفساراتكم بموضوع الاستفسارات .... !!


السلام مسك الختاآم