روبوتو هي واحدة من الخطوط الأكثر شعبية التي تستخدم على نطاق واسع في تطوير الموقع. العديد من المطورين اختيار ذلك بسبب مظهره نظيفة وحديثة ، فضلا عن تنوعها. في هذا الدليل ، وسوف ننظر في كيفية استخدام الخط روبوتو في مشاريع هتمل الخاص بك.
الخطوة الأولى هي تحميل خط روبوتو إلى موقع الويب الخاص بك. يمكنك القيام بذلك عن طريق إضافة التعليمات البرمجية التالية إلى ملف كس الخاص بك:
@استيراد رابط ('https://fonts.googleapis.com/css2?family=Roboto:wght@400; 700 & عرض = مبادلة');
يربط هذا الرمز خط روبوتو بوزن 400 (عادي) و 700 (غامق) إلى موقع الويب الخاص بك. يمكنك تغيير الوزن عن طريق إضافة أو إزالة الأرقام ، حسب احتياجاتك.
بمجرد تنزيل خط روبوتو ، يمكنك البدء في استخدامه على موقع الويب الخاص بك. للقيام بذلك ، فقط إضافة التعليمات البرمجية كس التالية:
يطبق هذا الرمز خط روبوتو على كل النص الموجود على موقع الويب. إذا كنت ترغب في استخدام الخط روبوتو فقط لعناصر معينة ، يمكنك تغيير محدد في كس لتناسب احتياجاتك.
استخدام الخط روبوتو في هتمل بسيط جدا ويمكن أن تحسن بشكل كبير من مظهر موقع الويب الخاص بك. جربه اليوم ولاحظ الفرق!
- مزايا استخدام خط روبوتو
- كيفية توصيل خط روبوتو إلى هتمل
- تكوين خط روبوتو باستخدام كس
- أمثلة على استخدام خط روبوتو
مزايا استخدام خط روبوتو
يوفر خط روبوتو العديد من المزايا التي تجعله خيارا مثاليا لأغراض مختلفة.
1. براعة. روبوتو هو خط متعدد الاستخدامات رائع لأنواع مختلفة من المحتوى. من السهل قراءتها على شاشة الكمبيوتر وعلى المواد المطبوعة ، نظرا لقراءتها الممتازة.
2. المرونة. روبوتو هو متاح في مجموعة متنوعة من الأساليب ، بدءا من رقيقة وخفيفة إلى جريئة وجريئة. هذا يسمح باستخدامه على حد سواء للعناوين والنص الرئيسي.
3. التصميم الحديث والجمالي. روبوتو لديه تصميم حديث ونظيف يجعل أي محتوى أكثر جاذبية للقارئ. إنها مناسبة لإنشاء صفحات وتطبيقات ويب حديثة وأنيقة.
4. من السهل اقامة. يتمتع خط روبوتو بدعم واسع النطاق لمتصفحات الويب والأجهزة المحمولة ، مما يسهل تكوينه واستخدامه على منصات وأنواع مختلفة من الأجهزة.
5. الانفتاح ومجانا. روبوتو هو خط مفتوح المصدر ، مما يعني أنه مجاني للاستخدام والتعديل. وهي متاحة للتنزيل والاستخدام دون أي قيود.
الخلاصة: يوفر خط روبوتو العديد من المزايا التي تجعله اختيارا ممتازا لإنشاء محتوى جذاب وسهل القراءة. إن تعدد استخداماته ومرونته وتصميمه الحديث وسهولة التخصيص والانفتاح يجعله أحد أفضل الخطوط لتصميم الويب وتطوير المحتوى.
كيفية توصيل خط روبوتو إلى هتمل
من أجل استخدام خط روبوتو في هتمل ، سوف نحتاج إلى وضعه على الخادم أو استخدام كدن (شبكة تسليم المحتوى).
1. تحميل خط إلى الخادم:
- تحميل الخط روبوتو من موقع جوجل الخطوط الرسمية.
- قم بفك ضغط الأرشيف الذي تم تنزيله وانسخ ملفات الخطوط (عادة الملفات ذات الامتدادات.صندوق النقد الدولي, .ووف,.2) إلى مجلد المشروع الخاص بك.
- وثيقة أتش تي أم أل الخاصة بك:
- 2. باستخدام جوجل الخطوط كندي:
- أضف الكود التالي إلى القسم
وثيقة أتش تي أم أل الخاصة بك:
- أضف الكود التالي إلى القسم
الخط الأسرة
الخط الأسرة: 'روبوتو' ، بلا الرقيق;
.
لاستخدام خط روبوتو على موقع الويب الخاص بك ، يمكنك استخدام خاصية كس
الخط الأسرة
الخط الأسرة: 'روبوتو' ، بلا الرقيق;
إذا كنت تريد استخدام أنماط خطوط مختلفة (على سبيل المثال ، غامق أو مائل) ، يمكنك استخدام الخيارات المناسبة في الخاصية
الخط الوزن
و
نمط الخط
. على سبيل المثال:
. صفي {
الخط الأسرة: 'روبوتو' ، بلا الرقيق;
- فئة صفي