يعد اختيار الخط الصحيح عنصرا مهما في تصميم صفحة الويب. عندما يفتح المستخدم الموقع ، يجب عليه رؤية النصوص في الخط المحدد لضمان سلامة وجودة العرض المرئي. ومع ذلك ، لا يعرف دائما مسبقا الخط المثبت على جهاز الكمبيوتر الخاص بالمستخدم وكيف سيتم عرضه على الموقع. ماذا علي أن أفعل في مثل هذه الحالة?
قد يكون الحل هو تثبيت الخط تلقائيا في المتصفح. هذا يسمح لك بالتحكم في مظهر النصوص باستخدام أنماط كس الخاصة. على سبيل المثال ، يمكنك تحديد قائمة الخطوط التي يجب استخدامها بترتيب التفضيل. سيحاول المتصفح عرض النص في كل خط من القائمة حتى يعثر على خط متاح.
لتثبيت الخط تلقائيا ، سوف تحتاج كس و هتمل المعرفة. في كس ، يمكنك تحديد نمط للنص باستخدام الأمر" عائلة الخط". في هتمل ، يمكنك استخدام هذا النمط لمنطقة النص أو للمستند بأكمله عن طريق تحديده في علامة "نمط". من الممكن أيضا تحديد العديد من خيارات الخطوط من أجل التحلي بالمرونة في العمل مع الأنظمة الأساسية والمتصفحات المختلفة. استخدم علامة "عائلة الخط" لكل خط في القائمة.
- هذا المثال يحدد الخط " أريال "للنص داخل علامة" الجسم". إذا لم يكن لدى المستخدم الخط" أريال "تثبيت ، فإن المتصفح محاولة لعرض النص في الخط" هلفتيكا "، ثم"بلا الرقيق". وبالتالي ، يضمن التثبيت التلقائي للخط مظهرا أكثر اتساقا للنص على جميع الأجهزة والأنظمة الأساسية.
- في الختام ، يعد التثبيت التلقائي للخط في المتصفح خيارا مفيدا يسمح لك بإنشاء صفحات ويب جميلة وعالية الجودة. استخدم قدرات كس و هتمل لتحديد قائمة الخطوط والتحكم في مظهر النصوص على موقعك. لا تنس أن اختيار الخط الصحيح يعزز بشكل كبير الانطباع المرئي للمحتوى.
باستخدام كس لتثبيت الخط تلقائيا في المتصفح
تثبيت الخط باستخدام أنماط كس
استخدام وجه الخط لتحميل الخط التلقائي
باستخدام كس لتثبيت الخط تلقائيا في المتصفح
يمكن استخدام كس لتثبيت الخط تلقائيا في المتصفح. المغلق (أوراق الأنماط المتتالية) يسمح لك لتحديد نمط عناصر صفحة ويب ، بما في ذلك اختيار الخط.
بادئ ذي بدء ، يمكنك تحديد وتعيين قائمة بالخطوط التي يجب استخدامها بواسطة متصفح الويب ، إذا كانت متوفرة على جهاز المستخدم. للقيام بذلك ، يمكنك استخدام خاصية عائلة الخط.
على سبيل المثال ، يسمح لك رمز كس التالي بتعيين الخطوط ذات الأولوية ، وإذا كانت مفقودة ، فسيبحث المتصفح عن الخطوط بالترتيب المحدد:
الخط الأسرة: أريال ، هلفتيكا ، بلا الرقيق;
وبالتالي ، إذا كان الخط أريال غير متوفر ، فإن المتصفح البحث عن الخط هلفتيكا ، وإذا لم يكن متوفرا ، سيتم استخدام أي خط بلا الرقيق.
لتحديد خط ، يمكنك أيضا استخدام الكلمة الأساسية لواجهة المستخدم للنظام ، والتي تشير إلى خط النظام لجهاز المستخدم. على سبيل المثال:
الخط الأسرة: نظام واجهة المستخدم ، بلا الرقيق;
يسمح هذا الأسلوب للصفحة بالتكيف مع إعدادات خط المستخدم ، مما يوفر سهولة قراءة وراحة بصرية أفضل.
يمكنك أيضا استخدام خطوط جوجل أو الخطوط الخارجية الأخرى عن طريق إضافة رابط إليها في نص مستند هتمل:
تثبيت الخط باستخدام أنماط كس
يمكن تعيين خطوط صفحة الويب باستخدام أنماط كس. للقيام بذلك ، استخدم الخاصية
مثال على تثبيت الخط:
محدد {
/ * مثال */
}
في هذا المثال ، يشار إلى أنه يجب عرض النص الموجود على الصفحة بخط أريال. إذا كان الخط أريال غير متوفر ، سيتم استخدام خط بلا الرقيق. إذا لم يكن هذا الخط متاحا ، فسيبحث المتصفح في النظام عن الخطوط المتاحة ويستخدم أول خط مناسب.التطبيق
- يمكنك استخدام قاعدة كس لتحميل الخط تلقائيا في المتصفح.
@الخط الوجه. يتيح ذلك لمطوري الويب استخدام الخطوط غير القياسية التي سيتم تحميلها مع الصفحة.
- عملية استخدام
@الخط الوجه. على سبيل المثال:
}