انتقل إلى محتوى الدرس

Italic and Oblique Font Styles إمالة الخط بخاصية font-style

تحكم في أشكال الخطوط بلغة CSS عبر خصائص font-style و font-weight و font-variant لضبط الإمالة وأوزان السماكة والأحرف المصغرة مع حماية الخطوط العربية من التشوه الصناعي.
4 صفوف تعليمية
لغة CSS
5,523 مشاهدة

شرح صفوف ومحتوى الفقرة

الصف 1 شرح توضيحي

بعد اختيار عائلة الخط وحجمه، تتكامل ثلاث خصائص محورية لضبط تعبيرات الحروف وإبراز المعاني وهي font-style و font-weight و font-variant. ونبدأ بخاصية font-style التي توفر ثلاث قيم للتحكم في استقامة الحرف أو ميلانه:

  • القيمة normal: تعرض الحروف قائمة معتدلة، وتُستخدم كثيراً لإلغاء الإمالة الافتراضية عن عناصر مثل <address> و <cite>.
  • القيمة italic: تستدعي النسخة المائلة الأصلية التي رسمها مصمم الخط يدوياً بانسيابية خاصة للأحرف اللاتينية.
  • القيمة oblique: تُمِيل الحروف القائمة نفسها هندسياً بزاوية مائلة (مثل oblique 12deg) دون تغيير شكل رسم الحرف.

في التصميم العربي الرصين، تجنب إمالة الجمل العربية بقيمتي italic أو oblique؛ لأن الخط العربي متصل بطبيعته على السطر، والإمالة الميكانيكية تكسر انسيابية الوصلات وتشوه مواضع النقاط.

الصف 2 صورة توضيحية
مخطط يلخص محاور تشكيل الحروف الثلاثة في CSS عبر إمالة font-style وسماكة font-weight والأحرف المصغرة font-variant
الصف 3 كود برمجي
CSS
.book-ref {
  font-style: italic;
}
.slanted-note {
  font-style: oblique;
}
address {
  font-style: normal;
}
الصف 4 ملاحظة هامة