Font Awesome 4.1.0 لا يعمل في محاكي Cordova android

StackOverflow https://stackoverflow.com//questions/25022589

سؤال

لا أستطيع معرفة سبب عدم ظهور أيقونات Font Awesome في تطبيق كوردوفا الخاص بي.

لقد قمت بتنزيل مجلد الخط الرائع بالكامل ونسخته إلى مجلد مشروعي.لقد قمت بتضمين المجلد مع:

<link rel="stylesheet" href="../font-awesome-4.1.0/css/font-awesome.min.css">

أنا متأكد من أن هذا صحيح لأنه <i class="fa fa-bars fa-2x"></i> سيتم عرضه بالكروم بشكل جيد تمامًا.

ولكن عندما أركض cordova emulate android لا تظهر الرموز في محاكي Android الخاص بي.

ثم حاولت بعد ذلك اتباع استكشاف الأخطاء وإصلاحها هنا: https://github.com/FortAwesome/Font-Awesome/wiki/Troubleshooting

يبدو أن استكشاف الأخطاء وإصلاحها يعتقد أن هذا خطأ متعلق بـ text-rendering, ولكن عندما أضيف text-rendering: auto; ل .fa { } في كل من ملفي CSS المصغر والكامل، ما زلت لا أرى الرموز في محاكي Android الخاص بي.

أنا في حيرة من أمري ماذا أفعل.مشروع Android المستهدف هو 4.4.2 مستوى API 19.هل أستطيع مساعدتك؟

إليك قسم html المتعلق بالأيقونات.

<body> 
    <div id="main">
           <div id="top">
               <i id="settings" class="fa fa-bars fa-2x"></i>
               <p id="logo" > Chowza Inc </p>
          </div>
    </div>
...
</body>
هل كانت مفيدة؟

المحلول 2

الإجابة على سؤالي الخاص...

لقد قمت بنسخ مجلد FontAwesome إلى مجلد المشروع الخاص بي ولكن عند الاستخدام cordova emulate android لم يتم إنشاء مجلد Font Awesome.أدى نسخ مجلد FontAwesome إلى مجلد CSS وتغيير مسارات الارتباط ذات الصلة إلى تصحيح هذه المشكلة.

نصائح أخرى

واجهت نفس المشكلة على تطبيق android 4.0.3 cordova.في حالتي اضطررت إلى إزالة معلمة الإصدار (v=4.1.0) من عنوان url.على سبيل المثال:

الكتلة القديمة في Font-awesome.css

@font-face {
  font-family: 'FontAwesome';
  src: url('../fonts/fontawesome-webfont.eot?v=4.1.0');
  src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.1.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff?v=4.1.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.1.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.1.0#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}

كتلة جديدة في الخط awesome.css

@font-face {
  font-family: 'FontAwesome';
  src: url('../fonts/fontawesome-webfont.eot');
  src: url('../fonts/fontawesome-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff') format('woff'), url('../fonts/fontawesome-webfont.ttf') format('truetype'), url('../fonts/fontawesome-webfont.svg#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}
مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top