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

السمة التي تحدد حجم خط هتمل: الخصائص والقيم وأمثلة الاستخدام

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

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

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

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

  1. أتش تي أم أل حجم الخط السمة: مفهوم ومعنى
  2. حجم الخط بالبكسل والقيم النسبية
  3. ميزات سمة حجم الخط: القيم المطلقة والنسبية
  4. القيم المطلقة
  5. القيم النسبية
  6. كيفية تعيين حجم الخط في كس: أمثلة الاستخدام

أتش تي أم أل حجم الخط السمة: مفهوم ومعنى

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

لتعيين حجم خط ثابت ، يمكنك استخدام سمة الحجم ، مع تحديد القيم من 1 إلى 7 ، حيث 1 هو أصغر حجم و 7 هو الأكبر.

مثال على استخدام سمة حجم الخط هتمل مع قيمة ثابتة:

  • نص مع أصغر حجم الخط

  • النص مع أكبر حجم الخط

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

لتعيين حجم الخط النسبي ، يمكنك استخدام سمة النمط مع خاصية حجم الخط ، مع تحديد القيمة بالنسب المئوية أو وحدات القياس النسبية.

مثال على استخدام سمة حجم الخط هتمل مع قيمة نسبية:

  • نص بحجم خط مخفض نسبيا

  • نص بحجم خط متزايد نسبيا

من المهم ملاحظة أن استخدام سمة حجم خط هتمل مباشرة في الترميز ليس أسلوبا موصى به. فمن المستحسن استخدام كس لنمط الخط والتحكم في حجم النص.

حجم الخط بالبكسل والقيم النسبية

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

يحتوي هذا النص على حجم خط 16 بكسل.

يتم استخدام هذا الأسلوب عند الحاجة إلى المطابقة الدقيقة لحجم الخط مع قيمة معينة.

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

القيم النسبية الأكثر استخداما هي:

  1. م هو حجم الخط يساوي قيمة حجم الخط الأساسي. على سبيل المثال ، لتعيين حجم الخط إلى حجمين أساسيين ، يمكنك استخدام التعليمات البرمجية التالية:

يحتوي هذا النص على حجم خط ضعف حجم القاعدة.

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

يحتوي هذا النص على حجم خط ضعف حجم القاعدة.

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

ميزات سمة حجم الخط: القيم المطلقة والنسبية

يحدد حجم الخط لمحتوى النص لعنصر هتمل.

يمكن أن تأخذ كل من القيم المطلقة والقيم النسبية.

القيم المطلقة

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

  • : نص صغير جدا
  • : نص صغير جدا
  • : نص صغير
  • : نص متوسط
  • : نص كبير
  • : نص كبير جدا
  • : نص كبير جدا

أمثلة:

نص صغير

القيم النسبية

القيم النسبية

  • تعيين حجم الخط نسبة إلى حجم الخط للعنصر الأصل.
  • أصغر

: أصغر حجم الخط

نص كبير

150 ٪ حجم الخط

حجم الخط 75٪
وبالتالي ، فإن السمة حجم الخط
يوفر خيارات واسعة لتحديد حجم الخط في هتمل.كيفية تعيين حجم الخط في كس: أمثلة الاستخداميمكن أن تأخذ خاصية حجم الخط قيما مختلفة ، مثل وحدات القياس المطلقة والنسبية:
وحدات القياسالوصفمثال
بكسلبكسلحجم الخط: 16 بكسل;

م

الحجم النسبي استنادا إلى حجم خط العنصر الأصل

حجم الخط: 1.2 م;

ريم

الحجم النسبي استنادا إلى حجم الخط للعنصر الجذر

حجم الخط: 1.2 ريم;

لتطبيق حجم الخط على عنصر ، يجب تحديد محدد العنصر ، متبوعا بخاصية حجم الخط بالقيمة المطلوبة: