استكشاف عبر حدود المتصفح

على الرغم من أن موضوعها يبدو رائعًا، إلا أنه يمكن القول أن هذه المقالة هي بمثابة هواية للأشخاص الذين يعانون من آلام في المعدة (مثلي ~) ~ عادةً ما يكون للمطورين طريقتهم الخاصة في الاسترخاء. لقد نشأت من سؤال حول الحدود طرحه أحد الأشخاص xd في المنتدى، لذلك قررت معرفة ذلك. لم يستغرق الأمر وقتا طويلا لكتابة المقال، لكن إعداد الصور استغرق وقتا طويلا. في هذه المقالة، دعونا نلقي نظرة على كيفية فهم كل متصفح للحدود.

تتضمن المتصفحات المشاركة في هذا الاختبار جميع المتصفحات التي تعمل بنظام التشغيل Windows تقريبًا: ie6، ie7، ie8، ie9preview، chrome، Firefox، safari، Opera، seamonkey. كل إصدار هو أحدث إصدار تم تنزيله من الإنترنت. ولأن أداء IE678 كان متسقًا في هذا الاختبار، وكان Firefox وseamonkey محاباة للأقارب، لذلك تم دمجهما في IE8 وفايرفوكس. الصورة أدناه هي لقطة شاشة لهذا المتصفح:

الأمر أعلاه مقصود. سيتم عرض الأسباب في الاختبار أدناه، كما يتم ترتيب لقطات الشاشة بهذا الترتيب.

انظر أولاً إلى الصورة أدناه. يتم عرض DIV مقاس 20 × 20 في ستة متصفحات، بحد علوي: 2 بكسل والباقي 1 بكسل. يبدو أنه لا يوجد فرق. وذلك لأن دقة 1 بكسل تمنعنا من الانتباه. (في الواقع، لسنا بحاجة إلى الاهتمام بهذه القضية برمتها ~)

قم أولاً بتبسيط المشكلة، جانب واحد هو 2 بكسل، وثلاثة جوانب 1 بكسل، وقم بتكبير النتيجة 5 مرات يمكننا أن نرى بوضوح هذا الاختلاف - Opera وSafari متضادان، IE8 يفتقر إلى الأذرع والأرجل، والعناصر الثلاثة التالية متسقة ~ هنا. تجدر الإشارة إلى أن الصف الثاني من 3 له تأثير تدريجي عند التقاطع.

ربما ينبغي لنا أن نجعل هذا التأثير أكثر وضوحا. عندما يكون جانب واحد فقط بالخط الغامق (10 بكسل)، يتم الكشف عن المراوغات في IE8 بوضوح. الأوبرا ورحلات السفاري لا تزال نسبية. أصبحت الجبهات المتحدة الثلاث التالية أكثر وضوحًا تدريجيًا.