السلام عليكم ورحمة الله وبركاته اهلاً بكم في درس جديد نتعلم فيه كيف نخصص النصوص والخطوط في لغة HTML.
في الدرسين السابقين لم نتعامل مع الخطوط فلقد اهتممنا بالاساسيات وثم الالوان واليوم الخطوط ان شاءالله تعالى.
ونحن تركنا الخطوط على الاعدادات الافتراضية وكما تعلمون فهناك الكثير من الخطوط وقد تتسائلون ما الخطوط التي استخدامنها في الدروس السابقة؟
لقد استخدمنا خط نوعه Times New Roman وحجمه 3 (بمقیاس متصفحات الإنترنت).
اذا كما تعلمون فلكل جزء في لغة HTML وسم يتحكم فيه والوسم الخاص بالخط هو < FONT > ... < FONT/ >. وھو یقوم بالتحكم بالخطوط من حیث النوع اللون والحجم. أما الخصائص التي نستخدمھا مع ھذا الوسم والوسوم الأخرى للخطوط فھي كالتالي:
ستحتاج الى هذه الدرجات في حال انك غيرت الحجم الافتراضي للخط لنقل على سبيل المثال الى 1 بدلاً من 3 ففي هذه الحالة ستحتاج الى تلك الدرجات لتمثيل الحجم الاكبر منه واذا غيرت الحجم الافتراضي الى 7 ستحتاج لتلك الدرجات لتمثيل الاحجام الاصغر منه.
بعض الأمثلة:
ـــــــــــ
طبعاً النتيجة مع كل مثال
الان سننتقل الى الوسم الاخر المتعلق بالخطوط وهو الوسم < BASEFONT >.
طبعاً ستتسائلون ما وظيفة هذا الوسم؟
وظيفته هي التحكم بكامل اعدادات الخط في كامل الصفحة من لون الخط الى حجمه الى نوعه.
طبعاً قد لاحظتم انه وسم مفرد فلا حاجة الى وسم البداية او النهاية طالما انه يتعامل مع الصفحة ككل او كامل الصفحة ان صح التعبير,طبعاً يفضل وضعه مباشرة بعد الوسم < BODY >.طبعاً سنستخدم معه نفس الخصائص التي استخدمناها مع الوسم السابق < FONT > (نستطیع استخدام الخاصیة Name معه بدلاً من Face)
وايضاً سنستخدمه بنفس الطريقة من دون اي اختلاف وسأوضح لكم بمثال بسيط:
< BASEFONT Name=" Arial " COLOR=" #FF0000 " SIZE=" 5 " >
وبدراسة ھذا المثال نستنتج أنه یقوم بتعدیل الخط الافتراضي للصفحة بحیث یصبح نوعه Arial وحجمه 5 ولونه أحمر. وبالتالي فإن كل النصوص المكتوبة في تلك الصفحة سیطبق علیھا ھذا النمط من الخط. ما لم نقم طبعا باستخدام الوسوم < Font > ... < Font/ > لتعدیلھا والتحكم بمظھرھا كما فعلنا في الأمثلة السابقة، فھي أكثر تحدیداً وأكثر مرونة من الوسم < BASEFONT > .
طبعاً بالحديث عن الالوان فلقد ذكرت لكم في الدرس السابق بعض الخصائص التي تتعلق باللون الاساسي للنص في الصفحة وهي الخاصية TEXT التي تكتب مع الوسم < Body > والتي استخدمناھا لتحدید لون نص الصفحة.
لا یوجد تعارض بین ھذه الخاصیة وخاصیة Color في الوسم < BASEFONT > فأنت بكل بساطة تستطیع استخدام أي منھما في صفحتك. وإذا حدث واستخدمت كلاھما
فإن اللون المحدد مع الوسم < BASEFONT > ھو الذي سیطبقه المتصفح ویعتمده.
ھناك وسوم خاصة تستخدم لتمییز العناوین Headings في صفحات الإنترنت وھي:
< Hn > < Hn/ >
وحرف n ھو رقم بین 6-1 یمثل مستوى العنوان.
الان سننتقل الى التأثيرات التي يمكننا اضافتها الى الخطوط:
1-الخط الغامق والعريض الاسود
لتطبيق التأثير سنستعمل وسمين وهما :
< b >...< b/ >
ولجعل النص عريض وغامق عليك وضع النص او كتابته بين الوسمين بالضبط
وأيضاً سنستعمل وسم < STRONG > ... < STRONG/ >
وللتوضيح اكثر :
2-الخط المائل:
3-الخط المسطر(اسفله سطر):
4-الخط المرتفع:
5-الخط المنخفض:
6-الخط الكبير:
7-الخط الصغير:
8- نص يتوسطه خط:
< b>< strike >هنا النص< /strike >
وايضاً يمكنكم استخدام وسم < s/ >...< s >
الان ساقدم مثال ونتيجته وسأشرحه:
المثال:
النتيجة:
وكما تلا حظون من المثال فقد كانت النتيجة نص مائل وعريض ومسطر وذلك لاننا استخدمنا الوسوم :
< /B >< i >< U >...< U/ > < I/ > < B >< b >
مثال اخر:
عند استخدام الوسوم المتعددة في مقطع واحد یجب مراعاة عدم التداخل بینھا.كيف ذلك؟
عليك ان تعتمد قاعدة بسيطة وهي ان الوسم الذي تبدأ به اولاً تنهيه اخيراً ولا يجب ان تكون الوسوم تبدأ وتنتهي بنفس الترتيب.
دورة لغة HTML : الدرس الثالث الخطوط
4/
5
Oleh
Ahmed alqaisi
تذكرو قول الله سبحانه وتعالى: وما يلفظ من قول الا لديه رقيب عتيد