@ Font-face متداخلة داخل media لا يعمل في Firefox 3.5 و IE8

Question

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

لدي @ وجه الخط يعمل بشكل جيد في WebKit (Safari و Chrome) والأوبرا، ولكن ليس في Firefox 3.5 أو IE 8.

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

إذا قمت بخدمة CSS وملفات الخطوط من مجال أصول ثابتة، ولديها خادم الأصول الثابتة تعيين المناسبة رأس التحكم في الوصول (التحكم في الوصول - الأصل)، الذي ينبغي العمل، يعمل في كل مكان باستثناء FF 3.5 و IE.

ما الذي يجب علي فعله لجعل هذا العمل؟

Answer 1

أفضل إجابة لقد اكتشفت حتى الآن، على أمل أن يساعد شخصا آخر:

بقدر ما أستطيع أن أقول، فإن القضية الرئيسية هي ما إذا كان ملف CSS (ليس ملف الخط) محمل عبر المجال. إذا قمت بتحميل ملف CSS مع تصريحات Font-font-font من مجال أصول Satic، فلا شيء سأفعل الخطوط تعمل في FF أو IE، بغض النظر عن رؤوس التحكم في الوصول. إذا قمت بتحميل ملف CSS من نفس المجال مثل الصفحة، أو أقوم فقط بتحريك تصريحات My Font-font الخاصة بي إلى كتلة نمط في رأس الصفحة، فهذا يعمل في جميع المتصفحات (يمكنني حتى تحميل ملفات الخطوط عبر الإنترنت طالما لدي مجموعة رأس التحكم في الوصول).

لتلخيص: AFAICT، FF 3.5 و IE 8 سوف يرفضون تكريم تصريحات وجه الخط في ملف CSS الذي تم تحميل المجال، بغض النظر عن ما.

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

في الواقع، كنت مخطئا. اتضح أن ضاغط CSS الذي كنا نستخدمه لنشر الأصول التي سيتم تقديمها من المجال المخصص كان التفاف قطعة كاملة من CSS مع "Media Screen {...}". لقد قارنت بعناية قواعد وجه الخط للتأكد من أن الضاغط لم يعزز معهم، ولكن لم يفحص أبدا بداية ملف CSS ونهاية الملفات التي تم التقاطها. عندما تحولت إلى خدمة نفس المجال، لم يحدث التفاف.

نظرا لأن الأمر اتضح، فإن IE و Firefox لا يحترم @ تصريحات وجه الخط ملفوفة داخل media: Safari، Chrome and Opera Do.

تنهد.

Answer 2

أود أن أقترح النظر في هذا ieblog post., ، والتي تصف كيفية تضمين الخط على IE. لا، لا يتطابق مع طريقة CSS3، ولا، ليس لديك أي طريقة أخرى للقيام بذلك في IE باستخدام Fon-Fon-Fone.

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

Answer 3

ساعدني هذا الرابط كثيرا: http://snook.ca/archives/html_and_css/becoming-a-font-mbedding-master.

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