الخميس، 27 مارس، 2014

استخدام الخطوط Fonts



استخدام الخطوط Fonts
ý      تفهم نوعية الخطوط .
ý      رمز الخطوط FontTag .
ý      استخدام الخطوط .
تفهم نوعية الخطوط :
تنقسم الخطوط إلي فئات كل فئة تضم مجموعة من أنواع الخطوط متجانسة ، فنري الفئة أو Category المسماة Serif تضم مجموعات من الخطوط مثل مجموعة Coutier ومجموعة Centary ومجموعة Garamond .      وكل مجموعة من هذه المجموعات تضم عدد من أنواع الخطوط قل أو كثر وسوف نجد نفس الشيء بالنسبة للخطوط العربية . ونجد العديد من الخطوط وقد نجد نفس الخط مكررا بخصائص مختلفة .
رمز الخطوط Font Tag :
الحديث عن الخطوط يستغرق أوقات كثيرة فنري مقدمة الرمز Font وعناصره المختلفة :
<FONT FACE=***    SIZE=***    COLOR=*** >……………..</FONT>
يجب أن يكون للرمز بداية ونهاية وآلا استمر تأثيره إلي نهاية البرنامج والعناصر المستخدمة مع هذا الرمز هي :
v    SIZE :  يعني الحجم ويستخدم لتحديد حجم الخط .
v    FACE :  يعني واجهة وهو يسمح لمصممي HTML بكتابة الخط الذي يريده.
v    COLOR  :  يعني اللون يسمح بإضافة اللون للنص المختار .
العنصر SIZE  :
نقوم باستخدام هذا العنصر لتحديد حجم الخط والقيم المتاحة هي من (1) أصغر حجم للخط إلي (7) أكبر خط .   نقوم بكتابة البرنامج التالي :
1-   من قائمة Start بالتأشير علي Programs ثم Accessorirs ثم نختار Notepad .
2-   يفتح برنامج Notepad في مستند خالي نكتب الأتي :

<HTML>
<HEAD>
<TITLE> Fonts Size </TITLE>
</HEAD>
<BODY>
<FONT SIZE=”1”>
Font size 1The Smallest <FONT> <BR>
<FONT SIZE=”3”> Font size 3The Smallest <FONT> <BR>
<FONT SIZE=”7”> Font size 7The Smallest <FONT> <BR>
</BODY>
</HTML>
العنصرFACE :
نقوم بكتابة أسم الخط المطلوب ، فمثلا نكتب Fcae= Arial ويمكن أن نكتب عدد من الخطوط داخل هذا العنصر بينهما فاصلة وسوف يقوم المستعرض بالبحث عن هذه الخطوط بترتيب كتابتها في العنصر، ولضمان سرعة البحث نكتبها بالترتيب مثل :
<FONT FACE= “Andalus, DiwaniBeni, MualirMT”>
توضح هذا العنصر نكتب بعض الخطوط الأكثر استخدما ونضعها في برنامج وتقوم باستخدام العنصر Size=6 حتي يكون حجم كل الخطوط أثناء العرض ، نكتب هذا البرنامج الأتي :
نقوم بتشغيل برنامج Notepad وفي مستند جديد نكتب البرنامج التالي :
<HTML>
<HEAD>
<TITLE> Fonts Face </TITLE>
</HEAD>
<BODY>
<FONT SIZE=”6” FACE = “Andalus” >
Font size 1The Smallest </FONT> <BR>
<FONT SIZE=”6” FACE = “DiwaniBeni” > Font size 3The Smallest </FONT> <BR>
<FONT SIZE=”6” FACE =”Courier”> Font size 7The Smallest </FONT> <BR>
</BODY>
</HTML>
العنصر Color :
يتح لنا اختيار الألوان للنص المكتوب وهذا العنصر لعمل لمصلحة النص المكتوب دون خلفية الشاشة ويمكننا استخدام رمز HEX أو اسماء الألوان نكتب البرنامج الأتي :
نقوم بتشغيل برنامجNotepad وفي مستند جديد نكتب البرنامج التالي :
<HTML>
<HEAD>
<TITLE>Font Color</TITLE>
</HEAD>
<BODY>
<FONT SIZE=”5”  COLOR= “RED”> RED  Color </FONT>
<FONT SIZE=”5”  COLOR= “#904563”>  Color </FONT>
<FONT SIZE=”5”  COLOR= “#892310”> RED  Color </FONT>
</BODY>
</HTML>

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

<HTML>
<HEAD>
<TITLE> Tables Fonts </TITLE>
</HEAD>
<BODY>
<TABLE BORDER=0 WIDTH=”70%”>
        <TR>
                <TD>
                        <FONT FACE=”Arial” Size=”4” Color=”Rad”> Arial </FONT>
                </TD>
                <TD>
                        <FONT FACE=”Arabic Transparent” Size=”4” Color=”Green”> Arabic </FONT>
                </TD>
        <TR>
                <TD>
                        <FONT FACE=”Tahome” Size=”4” Color= ”Blue”> Tahome</FONT>
                </TD>
                <TD>
                        <FONT FACE=”Traditional” Size=”4” Color= ”#904589”> Traditional </FONT>
                </TD>
        </TR>
</BODY>
</HTML>
تنبية هام جدا:
معظم مستخدمي إنترنت لديهم نظام Windos فليس معني ذلك أن الخطوط في كل الأجهزة متماثلة ولذلك لا ننصح باستخدام أي خط FONt بدون تحفظ ، فبعض الناس لا يقومون بتحميل كل الخطوط التي تأتي مع ويندوز ، كما أن بعضهم يستخدم خطوطا من برامج أخري أو تطبيقات كتلك المنتشرة لتوزيع الخطوط المختلفة كما أن بعضهم يستخدم مستعرض مختلف قد لاتسمع عنه يجب أن تستخدم الخطوط الشائعة الساسية ويجب أن تتحري ذلك .

ليست هناك تعليقات:

إرسال تعليق