![]() |
| font-size |
كيفية إختيار حجم الخط في المدونة :
يشير حجم الخط إلى حجم الأحرف التي تراها على الشاشة أو في الطباعة. وهو جانب مهم من جوانب البحث الذي يؤثر على القراءة وعلم الجمال. في عالم تصميم الويب، يتم التحكم في حجم الخط باستخدام أوراق الأنماط المتتالية (CSS). يوفر CSS عدة طرق لتحديد حجم الخط، بما في ذلك:
الوحدات المطلقة Absolute units
حدد الحجم بالوحدات المحددة بالبكسل (px) أو السنتيمتر (cm) أو البوصة (بوصة). وهذا يوفر تحكمًا أفضل ولكنه قد لا يتكيف بشكل جيد مع أحجام الشاشات المختلفة.
العناصر ذات الصلة Relative units
يحدد الحجم بالنسبة لحجم الخط أو حجم الخط للعنصر الأصلي. الأمثلة هي em، rem، ونسبة مئوية. وهذا يوفر بنية مرنة يمكنها التكيف مع المواقف المختلفة.
كلمة رئيسية Keywords:
يستخدم CSS (أيضًا xx-small) أقل من، أقل من، يساوي(medium)، أكبر من(large)، وما إلى ذلك. كما يوفر أيضًا كلمات رئيسية محددة مسبقًا مثل. يُظهر هذا الحجم النسبي بالنسبة لحجم خط المتصفح. يعتمد اختيار حجم الخط المناسب على عدة عوامل، مثل الغرض من النص (النص الأساسي والعنوان الرئيسي)، والمجموعة المستهدفة، والجمهور.
مجموعة من الكلمات الرئيسية التي تدل على القيم المطلقة بناءً على الحجم الافتراضي للمستخدم (وهو متوسط). السلوك مشابه لما نحصل عليه عند استخدام كود HTML <font size="1"> إلى <font size="7"> عندما يكون الحجم الافتراضي للمستخدم هو <font size="4"> .
حجم الخط أكبر (أكبر) أو أصغر (أصغر) من حجم العنصر الأصلي. نسبة التكبير/التصغير هي نفسها التي تفصل بين الكلمات الرئيسية المقدمة من قبل.
طول موجب (اكتب <طول> أو نسبة مئوية (اكتب <نسبة مئوية>). عندما يتم التعبير عن القيم بوحدات em أو ex، يكون الحجم بعد ذلك متناسبًا مع حجم خط العنصر الأصلي. وبالتالي، تكون القيمة 0.5em ستشير إلى أن حجم الخط للعنصر الحالي هو نصف الحجم المستخدم للعنصر الأصلي، وعندما تكون الوحدة المستخدمة هي rem، فإن الحجم يكون متناسبًا مع حجم الخط المستخدم لعنصر جذر html.
القيم المعبر عنها كنسب مئوية (النوع <percentage>) تتناسب مع حجم خط العنصر الأصلي.
الكلمات الأساسية هي طريقة بسيطة وفعالة لتحديد حجم الخط المطلوب استخدامه. باستخدام كلمة أساسية في عنصر <body>، يمكن للمرء تعيين الأحجام النسبية عبر الصفحة وتقليل حجم الخط أو زيادته وفقًا لذلك.
يتيح لك استخدام وحدات البكسل (px) الحصول على نتيجة ثابتة ومطلقة مستقلة عن نظام التشغيل والمتصفح. ومع ذلك، لا ينصح بهذه الطريقة لأنه لا يمكن الوصول إليها. وبالتالي، لا يمكن للمستخدمين تعديل حجم النص مع إعداداتهم إذا لزم الأمر.
يمكنك أيضًا تحديد حجم الخط في em. حجم القيمة المعبر عنها في em ديناميكي. عند تعيين خاصية حجم الخط، فإن em يعادل حجم الخط المطبق على العنصر الأصلي للعنصر الحالي. إذا لم يتم تعيين هذا الحجم للعنصر الأصلي، فسوف يتطابق مع الحجم الافتراضي للمتصفح (عادةً 16 بكسل). لذلك، إذا حددنا حجم الخط بقيمة 20 بكسل على عنصر النص، فإن 1em سيتوافق مع 20 بكسل و2em إلى 40 بكسل. هنا، القيمة 2 هنا يتضاعف الحجم.
الأنماط المختلفة المستعملة :
القيم دات الوحدات المطلقة :
- صغير جدا جدا; font-size: xx-small
- صغير جدا ; font-size: x-small
- صغير ; font-size: small
- متوسط ; font-size:medium
- واسع جدا جدا ;font-size: xx-large
- واسع جدا ;font-size: x-large
- واسع جدا ;font-size: large
القيم دات الوحدات النسبية:
;font-size: larger
;font-size: smallerالقيم دات الوحدات طولية:
;font-size: 12px
;font-size: 0.8القيم دات الوحدات نسبة مئوية:
;font-size: 80القيم دات الوحدات عامة:
;font-size : inheri
;font-size: initial
;font-size : unset