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