4 :XHTML (وسوم أخرى).

وسوم أخرى

بسم الله الرحمن الرحيم و الحمد لله و الصلاة و السلام على أشرف المرسلين محمد صلى الله عليه و سلم.
أما بعد
بعد معرفة كيفية كتابة فقرات و عناوين في صفحاتنا سنرى في هذا الجزء بعض الوسوم النادرة الاستعمال و هذا لا ينقص من أهميتها.
أيضا سنرى وسمين مهمين و لكن ليس في الوقت الراهن فأهميتهما مرتبطة بال CSS و هما الوسم <div> و الوسم <span>.
نبدأ على بركة الله.

وسوم نادرة الاستعمال لكن مفيدة
في بعض الأحيان تحتاج أن تكتب بعض الكلمات الغريبة بعض الشيء و خاصة في مجال الرياضيات كقوة عدد أو متتالية عددية.
ماذا يقول هذا الأخ، لم أفهم شيئا ؟
على رسلكم فلم أكمل حديثي بعد، المهم توفر لنا ال XHTML بعض الوسوم التي تساعدنا على كتابة مثل هذه الرموز، و هذين الوسمين هما <sub> و <sup> و سنتعرف علهما بعد قليل.
شيء أخر هناك وسم أخر أعتبره مهما جدا و يمكن إعتباره كبديل للغة CSS في الوقت الراهن (ليس قويا ولكن يفي بالغرض )، حيث يساعدنا على تلوين النصوص بالإضافة إلى تغيير نوع الخط و حجمه و هذا الوسم يدعى <font> و سنتعرف عليه كذلك بعد قليل.
و أخر وسمين سنتعرف عليهما في هذا الجزء هما <hr /> و <center> إن شاء الله.
<sub> و <sup>
كما قلنا <sub> تساعدنا على تمثيل كتابات مثل المتتاليات العددية أو غيرها و <sup> تساعدنا على كتابة قوة عدد و إليكم مثال لتوضيح ذلك.
كود:XHTML

<p>x² - 1 = 0</p>
<p>U_n=n+1</p>
<p>je suis le 1^er</p>

شاهد المثال
قم بتجريب الكود بنفسك أو إضغط على شاهد المثال و سترى أنه يعمل جيدا.
<font>
هذا الوسم لا يعمل إلا إذا كانت بداخله خاصيات وهي :
face لتحديد نوع الخط.
size لتحديد حجم الخط.
color لتحديد لون النص.
ملاحظة : يكفي استعمال خاصية واحدة لكي يعمل الوسم <font>.
نريد أن نكتب كلمة Animalsبخط verdana و بحجم 16 و باللون الأحمر إذن فالكود الذي سنحتاجه هو :
كود: XHTML

<p>there are a lot of <font face="verdana" size="16" color="#FF0000">Animals</font> in the earth.</p>

شاهد المثال
إنتظر، ما هو هذا النوع من الألوان و كبف لي أن أميز بينها؟
في لغة ال XHTML الألوان لها أكواد و هي دائما تكتب على هذا الشكل #000000 أو #FF00C0 إلخ...هذه الأرقام و الحروف السته تبدء من 0 إلى 9 و من A إلى F و كل ستة حروف و أرقام تعبر عن لون و يمكنكم زيارة العم Google و أبحتوا باستعمال كلمة color html و ستجدون الكثير عن هذه الألوان.
ملاحظة : يمكنك كتابة اسم اللون بالإنجليزية فمثلا في حالتنا هذه يكفي أن تكتب red و سيعمل الكود كسابقه.
المشكلة أنه هناك ألوان لا تملك إسما مثل مشتقات الأحمر ليس لها إسم لذا يعتبر الكود هو الحل الوحيد للإستفادة من جميع الألوان.
<hr />
هذا الوسم يساعدنا على وضع خط في الصفحة بغية تفرقة النصوص عن بعضها، و له إستعمالات أخرى، و ها هو مثال لتوضيح ذلك.
كود: XHTML

<h1 align="center"><font color="orange">Welcome, LearnInArabic</font></h1>
<p>LearnInArabic is a website created for the people who want to learn about programming languages and don’t know from where to start</p>
<hr />
<h2>About us</h2>
<p>we are a team of 2 members :<br />
Hassan bengmah.<br />
Zakaria azizi.</p>
<hr />
<h2>For what</h2>
<p>we have noticed that there are a few website that give lessons on Arabic and well explained. So we have decided to create this website </p>

شاهد المثال
يمكن تحديد طول الخط بواسطة الخاصية width و حجمه بالخاصية size و لونه بالخاصية color و هاكم مثال يوضح ذلك.
كود: XHTML

<h1 align="center"><font color="orange">Welcome, LearnInArabic</font></h1>
<p>LearnInArabic is a website created for the people who want to learn about programming languages and don’t know from where to start</p>
<hr width="50%" size="5" color="#F3CA05"/>
<h2>About us</h2>
<p>we are a team of 2 members :<br />
Hassan bengmah.<br />
Zakaria.</p>
<hr />
<h2>For what</h2>
<p>we have noticed that there are a few website that give lessons on Arabic and well explained. So we have decided to create this website </p>

شاهد المثال
في هذا المثال جعلت طول الخط يساوي نصف الصفحة و حجم الخط هو خمسة و أعطيتة كلون #FC008F.
ملاحضة : يمكن تحديد الطول بالنسبة المؤية أو بالبكسل مثل 200 أو 158 أو 604 إلخ...
لحظة من فضلك، ما هو البكسل (px) ؟.
البكسل وحدة للتعبير عن الطول في ال XHTML فمثلا 200px هي :

200px
بقي لنا أن نتكلم عن وسم أخير و هو <center>
<center>
الوسم <center> يمكننا من وضع النصوص أو الصور أو أي شيء أخر في وسط. الصفحة.
مثال:
كود: XHTML

<center><h1>Centered Title</h1></center>

شاهد المثال
الوسم <div> و الوسم <span>
الوسم <div>
الوسم <div> و هو من نوع ال blocks و معناه division أي تقسيم أو توزيع و هو يقوم بتقسيم الصفحة إلى أجزاء رئيسية مثل جزء القائمة و جزء لشعار الموقع و أخر للمحتوى و هكذا.
هناك طريقتان لتقسيم الصفحات إلى أجزاء الأولى بواسطة الجداول و سنرى كيف يمكننا فعل ذلك في الجزء الخاص بالجداول و هي طريقة تقليدية.
و الطريقة الثانية بواسطة الوسم <div> و هي الأكثر استعمالا في المواقع الحديثة.
و لكن كيف يمكننا ذلك؟.
في الوقت الحالي سنكتفي بهذا القدر بالنسبة لل <div> و سنتعرف عليها بشكل مفصل في درس ال CSS.
الوسم <span>
هذا الوسم من نوع ال inlines يساعدنا على تحديد لون و نوع و حجم و أهمية نص و لكن أيضا ليست له أي فائدة إذا لم يربط بال CSS.
إذ لم تكن لها فائدة فلم تخبرنا عنها الآن؟.
فقد من باب العلم بالشيء و لكن أعدكم أننا سنراهما بشكل مفصل في درس ال CSS.
بعد الانتهاء من شرح كيفية تنسيق النصوص، سنقوم في الجزء القادم بالتحدث عن الروابط و كيف يمكننا أن نتعامل معها، و أدعوا كل من لم يفهم هذا الجزء أن يقوم بإعادة قراءته من البداية.
في الختام أستودعكم الله الذي لا تضيع ودائعه، و السلام عليكم و رحمة الله.