الجمعة, فبراير 17, 2012

خصائص النصوص فى لغة HTML إتش تى إم إل

سنتعلم فى هذه التدوينه كيف نتحكم فى شكل النصوص عبر لغة HTML الرائعه, حيث سنتحكم بنوع الخط وحجمه ولون النصوص وكل ما يخص النصوص ستجده هنا بإذن الله فى هذه التدوينه.

الألوان

الحديث عن الألوان متشعب نظرا لإختلاف وتشعب مسألة الأذواق, لكن يكفى لنا أن نعرف أن الألوان لها دورا مهما فى إعطاء الجماليه للنصوص, لكن لا تبالغوا فيها وفى تنوعها حتى لا تصبح مؤذيه لعين القارىء.

ويكون كود HTML الذى نضيف به اللون كالآتى
<font color="#e92121">
النص أو الكلام المراد تلوينه بهذا الون
</font>
وهناك ثلاثة طرق لكتابة اسم اللون الذى نريده:
إما ان نسمى الألوان بأسمائها فى اللغه الإنجليزيه
أو اتباع اكواد الهيكساديسيمال hex وهى طريقة التعرف على اللون من خلال كتابة الكود الخاص به, ويكون الكود الخاص به على الشكل التالى
#0066cc
ويتكون كود الهيكساديسيمال من 6 أرقام وأمامهم علامة # وهو ما يعبر عن اللون.
ويمكننا الحصول على كود أى لون من خلال برامج التصميم بسهوله كبرنامج الفوتوشوب أو برنامج التقاط الألوان كولور بيك.

وأما الطريقه الثالثه فسنتركها الآن ونتحدث عنها لاحقا فى حديثنا عن لغة CSS سى إس إس.

الحجم

ويمكننا التحكم فى حجم النص عن طريق الوسم التالى
<font size="20px">
النص المراد إظهاره بهذا الحجم
</font>

إسم الخط ونوعيته

وهذه الخاصيه تسمح لنا بإظهار الخط بشكل معين من الخطوط وهو الشكل الذى نريده, ويتحقق ذلك فى الوسم التالى
<font face="arial">
الخط المراد ظهوره بهذا الشكل
</font>
وهناك الكثير من عائلات الخطوط المدعومه رسميا من المتصفحات والشبكه العنكبوتيه وهناك الكثير أيضا من الخطوط الغير مدعومه بعد.

شكل النص

ولدينا هنا من الخصائص ما تجعل الخط عريض أو مائل أو رفيع أو معتدل وغيرها من الخواص الأخرى
للحصول على نص غليظ
<b>
نص غليظ
</b>
للحصول على نص مائل
<em>
نص مائل
</em>
وطريقه اخرى للحصول على نص مائل
<i>
نص مائل
</i>
للحصول على نص تحته خط
<u>
نص تحته خط
</u>
للحصول على نص عليه خط أو مشطوب عليه
<s>
نص مشطوب
</s>
وهناك الكثير من الخواص التى ستعرفها عند تعمقك فى لغة HTML إتش تى إم إل.

العناوين

إذا أردنا أن نجعل من نصوص معينه عناوينا لفقرات فى صفحتنا, يجب أن نعطيها خصائص مختلفه أولا عن باقى النص الموجود فى الصفحه, وهناك أكواد معينه لجعل النص عنوانا لفقره, وهو على ستة أشكال للعناوين كالآتى
<h1> نص عنوان 1 </h1>
<h2> نص عنوان 2 </h2>
<h3> نص عنوان 3 </h3>
<h4> نص عنوان 4 </h4>
<h5> نص عنوان 5 </h5>
حيث أن h1 هو العنوان الأكبر حجما و h6 هو العنوان الأصغر حجما.

جهة النص أو الفقره

من الخصائص الرائعه الموجوده فى لغة إتش تى إم إل أننا يمكننا التحكم فى جهة النص على حسب ما نريد وذلك بأن يتواجد النص فى اليمين أو العكس فى اليسار وهكذا ... ويكفى أن نستعمل الوسم التالى
<p align="right">
النص جهة اليمين
</p>

خصائص أخرى

فى حالة الرغبه فى النزول إلى سطر جديد نستخدم فى آخر السطر السابق الوسم التالى
السطر الذى سيبدأ بعده سطر جديد <br>
وهذا الوسم من الوسوم الذى تحدثنا عنها سابقا وقلنا أن ليس لها وسم نهايه.
والوسم التالى يعطينا سطر ( خط ) ونستطيع التحكم فى لونه وسمكه وشكله كما نريد, وذلك من خلال الوسم التالى
<hr width="300px" size="5px" color="#020202">
وهو أيضا ليس له وسم نهايه.
والوسم التالى يعطينا مسافه بين كلمتين, حيث أنك إذا صنعت مسافات عاديه عند تحريركم للكود فستظهر مسافه واحده فى الصفحه مهما كان عدد المسافات التى صنعتها فى الكود, ولابد لك من إستخدام الوسم التالى وتكراره فى حالة رغبتك فى عمل مسافات كثيره
&nbsp;
إلى هنا وإنتهت تدوينتنا عن خصائص النصوص فى لغة HTML إتش تى إم إل وعليكم بالتدريب والتمرين العملى والتكرار أكثر من عشرات المرات فى إستخدام هذه الأكواد كى تتعود عليها وتحفظها.
من فضلك اضغظ لايك لمشاهدة لينك التحميل

3 تَعْلِيق:

  1. تدوينة رائعة يا ياسو .. تسلم يا كبير

    ردحذف
  2. والله تسلم ايدك جزاك الله خيرا

    ردحذف