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

كيفية توصيل خط في كس: تعليمات ، أمثلة التعليمات البرمجية / اسم الموقع

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

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

وفيما يلي تعليمات من شأنها أن تساعدك على توصيل الخطوط إلى كس:

  1. اختر خطا لمشروعك. يمكنك استخدام خط موجود توفره خدمات متنوعة ، أو إنشاء خط خاص بك.
  2. قم بتنزيل الخط بالتنسيق المطلوب (عادة هذا .ووف أو .ملف الصندوق).
  3. قم بإنشاء مجلد" الخطوط " في الدليل الجذر لمشروعك وانقل ملفات الخطوط إليه.
  4. في ملف كس الخاص بك ، إضافة قاعدة @الخط وجه لتوصيل الخط إلى المشروع:
  1. كيفية توصيل خط في كس: تعليمات ، أمثلة التعليمات البرمجية
  2. الخطوة 1: اختيار الخط وتحميله
  3. الخطوة 2: إنشاء قواعد كس للاتصال الخط
  4. الخطوة 3: تطبيق الخط على العناصر الموجودة على الموقع
  5. اسم الموقع

كيفية توصيل خط في كس: تعليمات ، أمثلة التعليمات البرمجية

الخطوة 1: اختر الخط المناسب لموقعك. يمكنك استخدام خطوط مجانية من موارد الإنترنت المختلفة أو توصيل خط مدفوع.

الخطوة 2: قم بتنزيل ملفات الخطوط على جهاز الكمبيوتر الخاص بك وفك ضغطها إذا كانت في الأرشيف.

الخطوة 3: قم بإنشاء مجلد" الخطوط " في المجلد الجذر لمشروعك وضع ملفات الخطوط في هذا المجلد.

الخطوة 4: افتح ملف نمط كس وأضف الكود التالي:

هنا ، استبدل "اسم الخط" باسم الخط الخاص بك ، و "اسم الخط".أوتف " إلى الملف المقابل للخط الخاص بك.

الخطوة 5: بعد ذلك ، في رمز كس الخاص بك ، حيث تريد استخدام هذا الخط ، إضافة التعليمات البرمجية التالية:

بدلا من" محدد " ، حدد محدد العنصر أو الفئة التي تريد تطبيق الخط عليها.

الخطوة 6: احفظ الملف وقم بتحديث الصفحة في المتصفح. الآن يجب توصيل الخط الخاص بك بنجاح وعرضه على الموقع.

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

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

الخطوة 1: اختيار الخط وتحميله

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

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

الخطوة 2: إنشاء قواعد كس للاتصال الخط

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

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

ح1 {

الخط الأسرة: 'اسم الخط' ، بلا الرقيق;

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

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

الجسم {

الخط الأسرة: 'اسم الخط 1' ، 'اسم الخط 2' ، بلا الرقيق;

}

الآن سيقوم المتصفح بتطبيق الخط الذي حددته على النص المحدد في العناصر المقابلة على صفحة الويب.

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

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

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

عائلة الخط: "اسم الخط" ، أريال، بلا شريف;

}