أهلا و سهلا بكم من جديد،
سنتعلم اليوم طريقة تنسيق وإضافة طراز إلى النصوص من خلال مجموعة من
الخصائص، سنتعرف على طريقة التحكم في النص من خلال خاصية وضع مسافة فراغ
قبل أول سطر من الفقرة text-indent، وخاصية زخرفة النص text-decoration، و
خاصية المسافة بين الحروف letter-spacing، وخاصية تحويل النص
text-transform.
خاصية وضع مسافة فراغ قبل أول سطر من الفقرة text-indent
text-indent: 30px;
خاصية محاذاة النص text-align
خاصية text-align تشبه في HTML خاصية "align" التي كانت تستخدم في الماضي،
النص يمكن محاذاته نحو اليسار "left" أو اليمين "right" أو في المنتصف
"centred" وبالإضافة إلى ذلك القيمة justify ستقوم بمحاذاة النص من
الجانبين.
text-align: right;
text-align: left;
text-align: center;
text-align: justify;
خاصية زخرفة النص text-decoration
الخاصية text-decoration تمكنك من إضافة زخارف أو تأثيرات على النص.
سطر أسفل النص
text-decoration: underline;
سطر فوق النص
text-decoration: overline;
سطر على النص
text-decoration: line-through;
استثناء عنصر بإزالة السطر
text-decoration: none;
خاصية المسافة بين الحروف letter-spacing
المسافة بين حروف النص يمكن تحديدها من خلال خاصية letter-spacing، والقيمة
المحددة لهذه الخاصية هي عرض المسافة التي تريدها بين كل حرف وآخر
letter-spacing: 6px;
خاصية تحويل النص text-transform
خاصية text-transform تتحكم بحجم الخط في اللغات الغربية، يمكنك أن تختار
بين القيم capitalize أوuppercase أو lowercase، وبغض النظر عن كيفية ظهور
النص الأصلي.
هناك أربع قيم يمكنك استخدامها مع الخاصية text-transform
تكبير الحرف الأول من كل كلمة مثال: "john doe" ستصبح "John Doe"
text-transform: capitalize;
جعل كل الحروف كبيرة، مثال: "john doe" ستصبح "JOHN DOE"
text-transform: uppercase;
جعل كل الحروف صغيرة، مثال: "JOHN DOE" ستصبح "john doe"
text-transform: lowercase;
النص سيظهر كما كتب في ملف HTML
text-transform: none;