جوكر ديزاين
اهلا اهلا اهلا بيك جوكر ديزاين بتحيك

منتديات من احسن المنتديات ممكن تتشرف بالتسجيل لو كنت لسة زائر من دون عضوية و لو كنت عضو عادي بالمنتدى سجل دخولك ما بعد احنا عايزين مشرفين ممكن تتشرحوا وشكرا تحياتنا ادارة المنتدى
جوكر ديزاين
اهلا اهلا اهلا بيك جوكر ديزاين بتحيك

منتديات من احسن المنتديات ممكن تتشرف بالتسجيل لو كنت لسة زائر من دون عضوية و لو كنت عضو عادي بالمنتدى سجل دخولك ما بعد احنا عايزين مشرفين ممكن تتشرحوا وشكرا تحياتنا ادارة المنتدى
جوكر ديزاين
هل تريد التفاعل مع هذه المساهمة؟ كل ما عليك هو إنشاء حساب جديد ببضع خطوات أو تسجيل الدخول للمتابعة.


تطوير/ تصميم / واجهات / بنرات / اعلانات /فوتوشوب / دعم فني / في بي
 
الرئيسيةأحدث الصورالتسجيلدخول


 

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

اذهب الى الأسفل 
2 مشترك
كاتب الموضوعرسالة
احمد محمد
المدير العام
احمد محمد


عدد المساهمات : 62
تاريخ التسجيل : 28/05/2011
الموقع : https://goker-desgin.mam9.com/

الدرس الرابع : تنسيق الخطوط  Empty
مُساهمةموضوع: الدرس الرابع : تنسيق الخطوط    الدرس الرابع : تنسيق الخطوط  I_icon_minitimeالأحد مايو 29, 2011 10:21 am

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


على الله نتوكل

تبدأ جميع الاوامر المتعلقه بــ الخطوط دائما بالامر
كود PHP:
<font>



و تنتهي بالامر
كود PHP:
</font>



لكن الشي الي يتغير هو الخاصيه المحطوطه ..

و هناك أربع خواص أساسيه لــ أوامر الخطوط تابعوا معي يا اخوان ..
أولاً : خاصية الوجه face ( نوع الخط )
و تستخدم كالتالي :
كود PHP:
<font face="traditional arabic, arabic transparent, simplified arabic">
يوضع النص هنــا ....
</
font>



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

ثانياً : لون الكتابه

وتأتي كالتالي :

كود PHP:
<font color="#ff00000">
يوضع النص هنــا ....
</
font>



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

تأتي كالتالي :

كود PHP:
<font size="2">
يوضع النص هنــا ....
</
font>



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


مثال على تصغير الخط
كود PHP:
<font size="-3">
يوضع النص هنــا ....
</
font>



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

مثال على تكبير الخط
كود PHP:
<font size="3">
يوضع النص هنــا ....
</
font>



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

الفرق بين كلتا الحالتين هو:
وضعنا اشارت سالب
كود PHP:
-



قبل الرقم المراد التصغير اليه
لتصبح بهذا الشكل
كود PHP:
-3



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

كود PHP:
<html>
<
head>
<
title> الخطوط </title>
</
head>
<
body>
<
font face="arial" size="5" color="#ff0000">
دورة لغة النص المتشعب على موقع مطور .. القاء : الوليد الراشدي
</font>
<
p>
<
font face="andalus" size="3" color="#0000ff">
www.mtwer.com <br>
للتواصل مع ملقي الدوره : عن طريق الهاتف : 0096899804305
عن طريق الايميل
: alwaleed-dos@windowslive.com
</font>
</
body>
</
html>



يلله الحين اختبروا أنفسكم و شوفوا اذا كنتوا حفظتوا طريقة أو لا .. يلله

تعالو نعمل مناقشه بسيطه للكود

اولا فتحنا بداية كود الـ html
وطبعا الكل بعرف كيف بنفتح كود الـ html لاننا اخذناه في دروس سابقه
وتحديدا في الدرس الاول

الان راح نعمل مناقشه للاكواد اللتي تم شرحها في هذا الدرس

اولا الكود

كود PHP:
<font face="arial" size="5" color="#ff0000">
دورة لغة النص المتشعب على موقع مطور .. القاء : الوليد الراشدي
</font>



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



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



طبعا وما حدا ينسا التسكير تبع وسم الخط وهو كالتالي
كود PHP:
</font>



مثلا سنضع خط اسمه tahoma
يصبح الكود كالتالي
كود PHP:
<font face="tahoma">نضع النص الملطوب هنا</font>



ثانيا خاصية الحجم size
نفس الكلام اللي شرحنا في خاصية face ( الشكل )
ليصبح الكود كالتالي
كود PHP:
<font size="4">نضع النص المطلوب هنا</font>



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

الان خاصية اللون color
نفس الكلام وما يتغير اي شيء
ليصبح الكود كالتالي
كود PHP:
<font color="ff0000">نضع النص المطلوب هنا</font>



أما بالنسبه للالوان و الخطوط فــ راجعوا الموضوع الي موجود في الدوره ..
http://mtwer.com/vb/showthread.php?t=3390


اذا حب احد يكتب صفحتو عن طريق اسماء الالوان فهو حر وذلك يسهل عليك معرفة اللون عند المراجعه والوصول اليه بسرعه اكثر

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

أولاً : الخط العريض ..
كود PHP:
<b> الكتابه هنا </b>



ثانياً : الي تحته خط
كود PHP:
<u> الكتابه هنا </u>



ثالثاً : المائل
كود PHP:
<i> الكتابه هنا </i>



الحين حاولوا تعملوا تطبيق لكل الي قلته يا اخوان ..

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

كود PHP:
<b><u><i> ضع الكلام هنا </b></u></i>



لكن يا اخوان حاولوا ما تحطوا أوامر كثيره لكل كلام أو فقره ع أساس ما يصير أي خربطه هناك وحطو كل التنسيقات للفقره بنفس التنسيق ..
مثال
كود PHP:
<b><i><u><font face="tahoma" color="ffff00" size="5">النص المطلوب هنا </b></i></u></font>



تطبيق عملي على الدرس و على ما سبقت دراسته :

اعمل صفحة html كامله بكامل أجزاءها و ليكن العنوان " تنسيق الخطوط باستخدام html "

و أكتب الفقره التاليه في العنوان مع مراعاة التنسيقات الموجوده ما بين الاقواس مثلما يلي :

الحرب العالميه الاولى (( تجعله العنوان الاول و تعمله محاذاه للوسط و تعمله بالخط العريض ))

(( تعمل خط أفقي و لك الحريه في اختيار تنسيقه لكن لازم تعمله محاذاه للوسط ))

مقدمه (( تعمل تحته خط و تجعله العنوان الثاني ))
(( تترك سطر ))

الحرب العالميه بدأت لاسباب مجهوله و بعضها معلومه لكن الاسباب المعلومه لم تكن تبرر الحرب و ما كان فيها من دمار .
الا أن الاطماع الاستعماريه كانت الهدف الاول للدول المتحاربه .
((
تعمل هذا الكلام في فقره وتعمله محاذاه لليمين و تخلي حجم الخط 2 و لونه
أزرق مع مراعات كل سطر من الفقره كما هو الان في هذا الموضوع ))



=========================================
وبكذا نكون خلصنا ..
و السلام عليكم و رحمة الله و بركاته
الرجوع الى أعلى الصفحة اذهب الى الأسفل
https://goker-desgin.mam9.com/
الشلهوب
المدير العام



عدد المساهمات : 53
تاريخ التسجيل : 29/05/2011

الدرس الرابع : تنسيق الخطوط  Empty
مُساهمةموضوع: رد: الدرس الرابع : تنسيق الخطوط    الدرس الرابع : تنسيق الخطوط  I_icon_minitimeالثلاثاء مايو 31, 2011 7:35 pm

مشكور والله يعطيك العافية ننتظر جديد ابداعك وتالقك المتميز
الرجوع الى أعلى الصفحة اذهب الى الأسفل
احمد محمد
المدير العام
احمد محمد


عدد المساهمات : 62
تاريخ التسجيل : 28/05/2011
الموقع : https://goker-desgin.mam9.com/

الدرس الرابع : تنسيق الخطوط  Empty
مُساهمةموضوع: رد: الدرس الرابع : تنسيق الخطوط    الدرس الرابع : تنسيق الخطوط  I_icon_minitimeالخميس يونيو 02, 2011 1:19 pm

شكرااااااا علي مرورك
الرجوع الى أعلى الصفحة اذهب الى الأسفل
https://goker-desgin.mam9.com/
 
الدرس الرابع : تنسيق الخطوط
الرجوع الى أعلى الصفحة 
صفحة 1 من اصل 1
 مواضيع مماثلة
-
» الدرس الاول : أساسيات لغة الــ html
» الدرس الخامس : تنسيق الشكل العام لصفحات الــ html
» تنسيق الفقرات و العناوين
» الدرس الثاني : الاجزاء الاساسيه في صفحات الــ html
» الدرس السادس : خاتمة دورة css

صلاحيات هذا المنتدى:لاتستطيع الرد على المواضيع في هذا المنتدى
جوكر ديزاين :: شركة جوكر ديزاين فعالياتنا :: لغات البرمجة :: دورة تعلم HTML-
انتقل الى: