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

أحجام الخطوط في كس: كيفية تعيين وتغيير أحجام الخطوط في الأنماط

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

تتمثل إحدى طرق تعيين حجم الخط في استخدام وحدات قياس مطلقة ، مثل وحدات البكسل (بكسل) أو النقاط (نقطة). على سبيل المثال ، يمكنك ضبط حجم الخط على 16 بكسل. يسمح استخدام الوحدات المطلقة بتحكم أكثر دقة في حجم النص،ولكن يمكن أن يخلق مشاكل في قابلية الصفحة للتكيف وقابلية التوسع.

هناك طريقة أخرى لتعيين حجم الخط وهي استخدام وحدات القياس النسبية مثل النسب المئوية ( ٪ ) أو إم أو ريم. على سبيل المثال ، يمكنك ضبط حجم الخط على 100 ٪ ، مما يعني أن حجم النص سيتطابق مع حجم النص الافتراضي في المتصفح. يتيح لك استخدام الوحدات النسبية إنشاء تصميم أكثر مرونة وتكيفا يتكيف مع أحجام مختلفة من الشاشات والأجهزة.

بالإضافة إلى تحديد حجم الخط ، يوفر كس أيضا خيارات لتغيير مظهر النص باستخدام خصائص مختلفة مثل السمنة (الخط الوزن) ، نمط (نمط الخط) ، اللون (اللون) وغيرها.

  1. كيفية تعيين أحجام الخطوط في كس
  2. الطرق الرئيسية لتعيين أحجام الخطوط
  3. تغيير أحجام الخطوط في المغلق
  4. نقاط مهمة عند العمل مع أحجام الخطوط

كيفية تعيين أحجام الخطوط في كس

وحدة بكسل (بكسل) مطلقة وغير قابلة للتغيير. إذا قمت بتحديد حجم الخط بالبكسل ، فسيكون له دائما نفس القيمة ، بغض النظر عن حجم نافذة المتصفح أو الجهاز.

تحدد قيمة النسبة المئوية ( ٪ ) حجم الخط بالنسبة إلى حجم الخط المحدد للعنصر الأصل. على سبيل المثال ، إذا كان حجم خط العنصر الأصل هو 16 بكسل ، ثم تعيين حجم الخط في العنصر الفرعي إلى 50 ٪ ، سوف تحصل على حجم الخط من 8 بكسل.

تحدد الوحدات المطلقة مثل النقاط (نقطة) أو المليمترات (مم) أو السنتيمترات (سم) أحجام الخطوط اعتمادا على الخصائص الفيزيائية للجهاز. ومع ذلك ، يوصى بتجنب استخدام الوحدات المطلقة في تطوير الويب ، حيث يمكن أن تؤدي إلى مشاكل في العرض على أجهزة مختلفة وقياس الصفحة.

تحدد الوحدات النسبية مثل إم وريم أحجام الخطوط بالنسبة إلى حجم الخط المحدد للعنصر الأصل أو العنصر الجذر (هتمل). يتم تحديد وحدة إم حسب حجم خط العنصر الذي يتم تطبيقه عليه ، بينما يتم تحديد وحدة الريم حسب حجم خط العنصر الجذر.

على سبيل المثال ، إذا تم تعيين حجم خط العنصر الأصل على 16 بكسل ، وكان حجم خط العنصر الفرعي 1.5 م ، فسيكون حجم الخط الفعلي 24 بكسل.

من المهم أن تتذكر أنه عند تعيين أحجام الخطوط في كس ، يجب أن تأخذ في الاعتبار إمكانية الوصول إلى النص وقراءته لمستخدمي الأجهزة والشاشات المختلفة. يوصى باستخدام الوحدات النسبية واختبار عرض النص على الأجهزة المختلفة لتحقيق أفضل نتيجة.

الطرق الرئيسية لتعيين أحجام الخطوط

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

  1. استخدام وحدات القياس المطلقة
  2. تسمح لك وحدات القياس المطلقة مثل وحدات البكسل (بكسل) والنقاط (نقطة) والمليمترات (مم) بتعيين أحجام الخطوط بدقة وبشكل متوقع. على سبيل المثال:

    ص {
  3. حجم الخط: 16 بكسل;
  4. }

    استخدام وحدات القياس النسبية
  5. تسمح لك وحدات القياس النسبية ، مثل النسب المئوية ( ٪ ) ، والنسبة المئوية ، وحركة العين السريعة ، بتعيين أحجام الخطوط بالنسبة إلى حجم العنصر الأصلي أو حجم الخط الأساسي. على سبيل المثال:
  6. ص {

    حجم الخط: 120%;
  7. }
  8. استخدام الكلمات الرئيسية

    توفر الكلمات الرئيسية مثل الصغيرة والمتوسطة والكبيرة أحجام خطوط محددة مسبقا. على سبيل المثال:

ص {

حجم الخط: كبير;

}

باستخدام وظيفة احسب ()

وظيفة احسب () يسمح لك لأداء العمليات الحسابية لتعيين أحجام الخطوط. على سبيل المثال:

ص {

حجم الخط: احسب (16 بكسل + 2 فولت واط);

}

تغيير أحجام الخطوط في المغلق

وحدة البكسل (بكسل) مطلقة وتحدد حجم الخط بالبكسل. على سبيل المثال ، لتعيين حجم الخط إلى 16 بكسل ، يمكنك استخدام رمز كس التالي:

  1. حجم الخط: 16 بكسل;
  2. وحدة النسبة المئوية ( ٪ ) نسبية وتعين حجم الخط بالنسبة إلى حجم خط العنصر الأصل. على سبيل المثال ، لتعيين حجم الخط إلى 150 ٪ من حجم الخط للعنصر الأصل ، يمكنك استخدام رمز كس التالي:
  3. حجم الخط: 150%;
  4. الوحدات النسبية إم و ريم هي أيضا نسبية وتعيين حجم الخط بالنسبة لحجم الخط للعنصر الأصل أو حجم الخط الأساسي للمستند ، على التوالي. على سبيل المثال ، لتعيين حجم الخط إلى 1.5 م من حجم الخط للعنصر الأصل ، يمكنك استخدام التعليمات البرمجية كس التالية:

حجم الخط: 1.5 م;