<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <ร่างกาย>
<html xmlns="http://www.w3.org/1999/xhtml">
<หัว>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>การแฮ็ก CSS ที่สร้างความแตกต่างให้กับ IE6, IE7, IE8 และ FireFox</title>
<style type="text/css">
-
#ทดสอบ#หมายเหตุ{
ระยะขอบ:0 อัตโนมัติ;
การจัดตำแหน่งข้อความ: กึ่งกลาง;
-
.note{ text-align:left; เยื้องข้อความ:40px;}
#ทดสอบ {
ความกว้าง:200px;
ความสูง:30px;
เส้นขอบ: 1px ทึบ #000000;
สี:#fff;
ความสูงของบรรทัด:30px;
-
.สี{
สีพื้นหลัง: #CC00FF; /*เบราว์เซอร์ทั้งหมดจะแสดงเป็นสีม่วง*/
สีพื้นหลัง: #FF00009; /*IE6, IE7, และ IE8 จะแสดงเป็นสีแดง*/
*สีพื้นหลัง: #0066FF; /*IE6 และ IE7 จะกลายเป็นสีน้ำเงิน*/
_สีพื้นหลัง: #009933; /*IE6 จะเปลี่ยนเป็นสีเขียว*/
-
-
</สไตล์>
</หัว>
<div id="test" class="color">ทดสอบบล็อก zss</div>
<div id="หมายเหตุ">
<strong style="color:#009933">IE6 กลายเป็นสีเขียว</strong>
<strong style="color:#0066FF">IE7 กลายเป็นสีน้ำเงิน</strong>
<strong style="color:#FF0000">IE8 กลายเป็นสีแดง</strong>
<strong style="color:#CC00FF">FireFox เปลี่ยนเป็นสีม่วงในที่สุด</strong>
<ระดับ div = "หมายเหตุ">
วันนี้ฉันเห็นบทความใน hiccblogs เกี่ยวกับความเข้ากันได้ของ IE8 มันง่ายมาก น่าเสียดายที่มันเข้ากันได้กับ IE เท่านั้น และมันใช้แกนหลักของ IE7 ซึ่งมีข้อจำกัดอย่างมาก ฉันคิดว่าฉันค่อนข้างเชี่ยวชาญในความเข้ากันได้ของ CSS เนื่องจาก IE8 เปิดตัว เรามาศึกษาความเข้ากันได้ของ IE8 กันดีกว่า
</div>
<div class="note">ความเข้ากันได้ของ CSS เป็นเรื่องที่น่าปวดหัวสำหรับทุกคนเสมอมา IE6, IE7 และ FF สร้างปัญหาให้กับทุกคนแล้ว ในบทความก่อนหน้านี้ มีการแนะนำความรู้มากมายในด้านนี้ นับตั้งแต่เปิดตัว IE8 เวอร์ชันอย่างเป็นทางการ ฉันก็พยายามหาวิธีแยกแยะจากเวอร์ชันอย่างเป็นทางการของ IE8 การค้นหาบน Baidu ก็มีผลลัพธ์มากมาย และการค้นหาบน Google ก็มีผลลัพธ์มากกว่านั้นอีก มีความแตกต่างอย่างมากระหว่างเวอร์ชันอย่างเป็นทางการและเวอร์ชันเบต้าของ IE8 ในแง่ของการแฮ็ก ยิ่งกว่านั้น วิธีการเกือบทั้งหมดบนอินเทอร์เน็ตได้รับการพิมพ์ซ้ำจากกัน วิธีที่ปรากฏบ่อยที่สุดคือรูปภาพแฮ็กจาก linxz.cn ขออภัย วิธีการในภาพนี้ไม่ถูกต้องสำหรับ IE8 เวอร์ชันอย่างเป็นทางการ
หลังจากการวิเคราะห์และสรุปแล้ว เราก็มีวิธีแก้ปัญหาที่มีประสิทธิภาพดังต่อไปนี้ บางทีอาจมีการแฮ็กที่ดีกว่าและง่ายกว่านี้ในอนาคต แต่สำหรับตอนนี้ วิธีนี้สามารถแก้ปัญหาความต้องการเร่งด่วนได้<br />
</div>
<ระดับ div = "หมายเหตุ">
<ul>
<li style="list-style:none;"><strong style="color:#009933">ตัวอย่างง่ายๆ:</strong></li>
<li>"9" ตัวอย่าง: "margin:0px auto9;".</li>
<li>"9" ที่นี่สามารถแยกแยะระหว่าง IE และ FireFox ทั้งหมดได้</li>
<li>"*" IE6 และ IE7 สามารถจดจำได้ IE8 และ FireFox ไม่สามารถทำได้</li>
<li>"_" IE6 สามารถจดจำ "_" ได้ แต่ IE7, IE8 และ FireFox ไม่สามารถ</li>
</ul>
</div>
</div>
</ร่างกาย>
</html>