يوضح الشكل التالي معدل عرض المتصفح في تفاصيل الزائر في نظام إحصائيات الموقع ، ويحسب IE6 أكثر من 40 ٪. على الرغم من أن هناك العديد من أنواع المتصفحات ، إلا أن IE وحده لديها العديد من الإصدارات مثل IE5.5 و IE6 و IE7 و IE8 ، وما إلى ذلك. من بين هذه الإصدارات العديدة العديدة ، لا يزال IE6 محبوبًا من قبل معظم المستخدمين ، لذلك عند الكتابة ، لا يعتبر IE6 مشكلة التوافق في IE6 ، وإلا فإنها ستخسر العديد من الزوار.
فيما يلي 10 قضايا يجب الانتباه إليها في IE6:
1. استخدم doctypeتحتاج إلى إضافة نوع doctype في الجزء العلوي من صفحة HTML. بالطبع ، فإن الإصدار الصارم يستحق التوصية ، على سبيل المثال:
<! doctype html public -// w3c // dtd html 4.01 // en
http://www.w3.org/tr/html4/strict.dtd>
أو ، صفحة XHTML! Doctype:
<! doctype html public -// w3c // dtd xhtml 1.0 Strict // en
http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd>
آخر شيء تريد رؤيته هو أن IE6 يدخل وضع Quirk - هناك بالفعل ما يكفي من المراوغات.
2. وضع الموقف: قريبتحديد الموضع: يحل النسبي أكثر من مشكلة واحدة ، خاصة عند تحديد المحاذاة. من الواضح أن الشيء الوحيد الذي تحتاج إلى فهمه هو أن تحديد المواقع المطلقة يتحدث نسبيًا. ربما ، نظرًا لأنه ليس لديك مجموعة ، فأنت لا تعرف أن كل شيء قد طار هناك. على سبيل المثال ، إذا قمت بتصميم كل مقالة ، فهناك صورة قبل ذلك ، وأخيراً ، ستجد أن هناك صورة واحدة فقط على الصفحة ، وربما تتداخل.
3. عرض العرض: قيمة مضمنة للعناصر العائمةهذا ينبع من علة الهامش المزدوجة الشهيرة IE6. على سبيل المثال ، إذا قمت بتصميم عائم للحصول على الهامش والهامش اليساري: 5px ؛ ، فمن المحتمل أن يكون الهامش اليساري: 10 بكسل في IE6. هنا ، SET DISPLAY: مضمّن للعناصر العائمة لحل المشكلة.
4. تعيين haslayout للعناصريمكن حل العديد من مشاكل IE6 (أو IE7) عن طريق تحديد قيمة Haslayout. (إذا كنت لا تعرف ما هو Haslayout ، يرجى الاطلاع هنا)
أسهل طريقة لضبط قيمة haslayout لعنصر ما هي إضافة ارتفاع أو عرض CSS (بالطبع ، يمكن أيضًا استخدام التكبير ، ولكن هذا ليس جزءًا من CSS). يوصى بتعيين قيمة محددة ، ولكن في بعض الأحيان لا يعني ذلك بالضرورة أن الارتفاع هو. هنا ، يمكنك استخدام الارتفاع: 1 ٪. إذا لم يحدد العنصر الأصل الارتفاع ، فلن يتغير الارتفاع الفعلي للعنصر ، ولكن لديه بالفعل خاصية Haslayout.
5. حل مشكلة الأحرف المتكررةقد يتسبب التصميم المعقد في ظهور بعض النصوص داخل العناصر العائمة أسفل موضع التنظيف العائم. هذه مشكلة غريبة ، ويمكن أن تساعدك التالية في حلها:
• تأكد من أن العرض: تم ضبطه على العنصر العائم ؛
• استخدام يمين الهامش: -3px في العناصر العائمة ؛
• أضف تعليق IE بعد العنصر الأخير من العنصر العائم ، على سبيل المثال: <!-[if! ie]> دع تعليقك هنا ... <! endif]->
• أضف DIV إلى العنصر الأخير (هذا لتعيين العرض على 90 ٪ أو ارتفاع مماثل)
تحديث: أسهل طريقة هي حذف جميع التعليقات. (بفضل Tian Wei'er على نصيحتها ، لم أواجهها بنفسي ، لكن بعد غوغل ، وجدت أنه يمكن أيضًا حل هذه الطريقة ، وهذه طريقة موصى بها.)
يمكنك الاطلاع على المزيد من التفسيرات حول هذا الأمر في موقع tormeverything.net.
6. استخدم فقط التحوم في علامة <a> ، IE6 يدعم فقط علامة <a> لعرض نمط التحويم
بالطبع ، لا يزال بإمكانك حل هذه الطريقة من خلال JS. ومع ذلك ، هذا يتعلق بإمكانية الوصول. يوصى بعدم تعيين محتوى مهم في التنفيذ باستخدام JS.
7. استخدم! محدد مهم أو متقدم لتمييز متصفح IEعلى سبيل المثال ، يمكن أن يتجنب Mineight استخدام CSS لتحقيق التوافق مع IE.
#عنصر {
MINIight: 20em ؛
الارتفاع: Auto! مهم ؛
الارتفاع: 20EM ؛ /* دع IE6 يعرض هذا الارتفاع*/
}
لا يمكن أن تحدد IE6 بشكل صحيح. يمكنك ضبط ارتفاع ثابت للسماح لـ IE6 بحل 20EM. ومع ذلك ، فإنه سيغير ارتفاعه بسبب حجم المحتوى. طريقة أخرى هي استخدام المحددات المتقدمة:
#عنصر {
MINIight: 20em ؛
الارتفاع: 20EM ؛
}
/ * تجاهل IE6 */
#element [id] {
الارتفاع: السيارات ؛
}
8. تجنب أحجام التحجيمسوف يخلط المقياس IE6 إلا إذا قمت بإضافة ارتفاع دقيق للعنصر الأصل. خلاف ذلك ، أضف! مهم للآخرين ، على سبيل المثال:
جسم{
الهامش: 2 ٪ 0! مهم ؛
الهامش: 20px 0 ؛ /* ie6 قابلة للقراءة*/
}
9. الاختبار في أقرب وقت ممكن ، الاختبار بشكل متكررلا تنسى الاختبار مبكرًا واختبارها بشكل متكرر ما لم يكتمل مستواك. خلاف ذلك ، قد تقضي المزيد من الوقت في حل مشاكل IE6. بشكل عام ، إذا كان موقع الويب الخاص بك يمكن أن يؤدي بشكل جيد تحت IE6 و Firefox ، فمن المقدر أن المتصفحات الأخرى لن تواجه أي مشاكل كبيرة.
10. إعادة تشكيل الرمز الخاص بكفي كثير من الحالات ، قد يستغرق حل المشكلة وقتًا أطول من إعادة تمثيل الكود الخاص بك.