تنسيق النصوص

لون النص

تستخدم خاصية اللون color لتلوين نص معين

باستخدام لغة CSS يمكنك استخدام احدى هذه الطرق لتلوين نص معين

• باستخدام قيمة HEX مثال "#FFFFFF"


• باستخدام قيمة RGB مثال "rgb(255,0,0)"


• باستخدام اسم اللون مثل "Red"

ان اللون الافتراضي للصفحة معرّف من خلال المنتقى body

مثال

body {color:blue;}
h1 {color:#00ff00;}
h2 {color:rgb(255,0,0);}

ملاحظة : اذا قمت بتحديد خاصية اللون color فعندها يجب أيضاً ان تحدّد لون الخلفية background-color أيضاً

---

محاذاة النص

تستخدم خاصية محاذاة النص text-align لضبط المحاذاة بشكل أفقي للنص

يمكن للنص أن يتم محاذاته للوسط center أو لليمين right أو اليسار left أو ممدد justify
عند استخدام القيمة ممدد justify فهذا يعني كل سطر سيتم تمديده ويكون مساوٍ له في العرض كما أن هوامش اليمين واليسار مستقيمة (كما في الجرائد والمجلات)

مثال

h1 {text-align:center;}
p.date {text-align:right;}
p.main {text-align:justify;}

زخرفة النص text decoration

تستخدم خاصية زخرفة النص text-decoration لضبط أو ازالة زخرفة معينة للنص

تستخدم بشكل واسع زخرفة النص لإزالة الخط من تحت النص ضمن الرابط التشعبي لأهداف زخرفية

مثال

a {text-decoration:none;}

كما يمكن ايضاً زخرفة النص

مثال

h1 {text-decoration:overline;}
h2 {text-decoration:line-through;}
h3 {text-decoration:underline;}
h4 {text-decoration:blink;}

ملاحظة : لايفضّل وضع خط تحت اي نص مالم يكن رابط تشعبي لأنه يسبب بعض الارتباك للمستخدم

---

تحويل النص Text Transformation

تستخدم خاصية تحويل النص وذلك لتحويل النص لأحرف صغيرة lowercase أو أحرف كبيرة uppercase
تستخدم لتحويل النص كله لأحرف كبيرة أو أحرف صغيرة أو تكبير الحرف الأول لكل كلمة
ملاحظة : تستخدم هذه الخاصية فقط مع الكلمات باللغة الإنكليزية وليس اللغة العربية

مثال

p.uppercase {text-transform:uppercase;}
p.lowercase {text-transform:lowercase;}
p.capitalize {text-transform:capitalize;}

---

تباعد النص Text Indentation

تستخدم خاصية تباعد النص لتحديد تباعد السطر الأول من فقرة معينة ( تستخدم مع فقرات اللغة الانكليزية)

مثال

p {text-indent:50px;}

---

الخاصية	الشرح
color	تغيير لون النص
direction	تحديد وجهة النص أو وجهة الكتابة يمين يسار أو يسار يمين
letter-spacing	زيادة أو نقصان المسافة بين الأحرف في النص
line-height	تحديد ارتفاع النص
text-align	تحديد المحاذاة الأفقية للنص
text-decoration	تحديد الزخرفة المضافة للنص
text-indent	تحديد الفجوة في السطر الأول لمجموعة النص
text-shadow	تحديد تأثيرات الظل المضافة على النص
text-transform	التحكم بالأحرف الكبيرة و الصغيرة للنص
vertical-align	تحديد المحاذاة العمودية للعنصر
white-space	تحديد كيفية التحكم بالمسافات داخل العناصر
word-spacing	زيادة أو نقصان المسافة بين الكلمات في النص

---