تؤثر مشكلة محددة نشأت مؤخرًا على مواقع الويب التي تستخدم ألواح الروبوتو في الكروم. على الرغم من أن الخط يظهر كما هو متوقع في المتصفحات الأخرى ، إلا أنه لا يزال غير مرئي عند تحميل الصفحة الأولية في Chrome.

عند التحقيق ، يبدو أن هذا خطأ معروف في الكروم. سبب المشكلة هو أن Chrome قد يفشل في بعض الأحيان في تقديم خطوط مخصصة بشكل صحيح أثناء تحميل الصفحة الأولية. ومع ذلك ، بمجرد إعادة ترجمة خاصية CSS (على سبيل المثال ، عن طريق التحوم على رابط مصمم على تصميم) ، يصبح الخط مرئيًا.

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

الجسم { -webkit-animation-delay: 0.1S ؛ -webkit-enimation-name: fontfix ؛ -بكيت مدة إدارة: 0.1S ؛ -webkit-animation-ational-count: 1 ؛ -webkit-animation-timing-function: خطي ؛ } @-webkit-keyframes fontfix { من {عتامة: 1 ؛ } إلى {عتامة: 1 ؛ } }

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