رابعا : تنسيق الخطوط

رابعا : تنسيق الخطوط Html

وَقل رَّبِّ زِدْنِي عِلْمًا

تبدأ جميع الاوامر المتعلقه بــ الخطوط دائما بالامر

و تنتهي بالامر

لكن الشي الي يتغير هو الخاصيه المحطوطه ..
و هناك أربع خواص أساسيه لــ أوامر الخطوط تابعوا معي يا اخوان ..

أولاً : خاصية الوجه face ( نوع الخط )
و تستخدم كالتالي :

يوضع النص هنــا ....

انا حطيت ثلاث خطوط ... تدرون ليش ؟
لان اذا ما لم يستطع المتصفح عند ترجمة الشفره الى صفحة ويب الخط الاول راح يحط الخط الي بعده
و اذا ما حصل الثاني يحط الي بعده وعلى هذا المنوال
ثانياً : لون الكتابه
وتأتي كالتالي :

يوضع النص هنــا ....

ثالثاً : خاصية قياس الخط ( الحجم )
تأتي كالتالي :

يوضع النص هنــا ....

رابعاً : خاصية تكبير الخط أو تصغيره وهذه لا تختلف عن النقطه الثالثه إلا بإنه تستطيع تصغير الخط
وفضلت شرح كل واحده على حذى ...
مثال على تصغير الخط

يوضع النص هنــا ....

هذا يعني تصغير الخط 3 درجات عن المعدل الافتراضي
مثال على تكبير الخط

يوضع النص هنــا ....

هذا يعني تكبير الخط 3 درجات عن المعدل الافتراضي
جرب كلتا الامرين وشوف بنفسك
الفرق بين كلتا الحالتين هو:
وضعنا اشارت سالب

قبل الرقم المراد التصغير اليه
لتصبح بهذا الشكل

-3

تعالوا نشوف مثال يتضمن كل الي قلته ..

<html>

<head>

<title> الخطوط </title>

</head>

<body>



دورة لغة النص المتشعب على موقع مدونة ابداع .. القاء : M.elgemezy







http://abda3ofdesign.blogspot.com 

ابداع ديزين



</body>

</html>

الان اختبروا أنفسكم و شوفوا اذا كنتوا حفظتوا طريقة أو لا ..
تعالو نعمل مناقشه بسيطه للكود
اولا فتحنا بداية كود الـ html
وطبعا الكل بعرف كيف بنفتح كود الـ html لاننا اخذناه في دروس سابقه
وتحديدا في ( الدرس الاول )
الان راح نعمل مناقشه للاكواد اللتي تم شرحها في هذا الدرس
اولا الكود

دورة لغة Html.. القاء : m.elgemezy

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

وضعنا مسافه واحده بين كلمة font والكلمه التي تليها
الان نضع شكل الخط مثلا بالخاصيه face
لتصبح هكذا

طبعا وما حدا ينسا التسكير تبع وسم الخط وهو كالتالي

مثلا سنضع خط اسمه tahoma
يصبح الكود كالتالي

نضع النص الملطوب هنا

ثانيا خاصية الحجم size
نفس الكلام اللي شرحنا في خاصية face ( الشكل )
ليصبح الكود كالتالي

نضع النص المطلوب هنا

ملاحظه بخصوص حجم الخط
الخطوط في لغة ال html
تكون من 1 الى 7
اي رقم نضعه اكبر من الرقم 7 يتعرف عليه كانه خط بحجم 7
الان خاصية اللون color
نفس الكلام وما يتغير اي شيء
ليصبح الكود كالتالي

نضع النص المطلوب هنا

اذا حب احد يكتب صفحتو عن طريق اسماء الالوان فهو حر وذلك يسهل عليك معرفة اللون عند المراجعه والوصول اليه بسرعه اكثر
بس يا اخوان احنا تونا ما خلصنا بعد ..
شوفوا في ثلاث أوامر موجوده تندرج تحت نفس الموضوع ونحنا اخذناها في دروس سابقه ..
الي هي أوامر الكتابه بخط عريض أو الكتابه اللي تحتها خط او كتابه بخط مائل
يلله نشوفها مع بعض مره اخرى للتذكير ..
أولاً : الخط العريض ..

الكتابه هنا

ثانياً : الي تحته خط

الكتابه هنا

ثالثاً : المائل

الكتابه هنا

الحين حاولوا تعملوا تطبيق لكل الي قلته يا اخوان ..
ملاحظه : طريقة كتابة الاوامر مع بعضها البعض تأتي كالتالي :

ضع الكلام هنا

لكن يا اخوان حاولوا ما تحطوا أوامر كثيره لكل كلام أو فقره ع أساس ما يصير أي خربطه هناك وحطو كل التنسيقات للفقره بنفس التنسيق ..
مثال

ضع الكلام هنا

تطبيق عملي على الدرس و على ما سبقت دراسته :
اعمل صفحة html كامله بكامل أجزاءها و ليكن العنوان " تنسيق الخطوط باستخدام html "
و أكتب الفقره التاليه في العنوان مع مراعاة التنسيقات الموجوده ما بين الاقواس مثلما يلي :
الحرب العالميه الاولى (( تجعله العنوان الاول و تعمله محاذاه للوسط و تعمله بالخط العريض ))
(( تعمل خط أفقي و لك الحريه في اختيار تنسيقه لكن لازم تعمله محاذاه للوسط ))
مقدمه (( تعمل تحته خط و تجعله العنوان الثاني ))
(( تترك سطر ))
الحرب العالميه بدأت لاسباب مجهوله و بعضها معلومه لكن الاسباب المعلومه لم تكن تبرر الحرب و ما كان فيها من دمار .
الا أن الاطماع الاستعماريه كانت الهدف الاول للدول المتحاربه .
(( تعمل هذا الكلام في فقره وتعمله محاذاه لليمين و تخلي حجم الخط 2 و لونه أزرق مع مراعات كل سطر من الفقره كما هو الان في هذا الموضوع ))