กรกฎาคม 2, 2007 at 9:59 am
· Filed under CSS hacks
Internet Explorer 7 เป็นอีกเบราเซอร์หนึงที่มีปัญหามากมายเหลือเกิน ทั้งด้าน javascript ,Thai font และ CSS เราก็ต้องมาตาม hack มันอีกเช่นเคย
IE7 เท่านั้น อ่านบรรทัดนี้
*:first-child+html เว้นวรรค ตามด้วยคลาส ไอดี ที่คุณอยากจะสั่งมัน {}
เช่น *:first-child+html .ss {font-size:10px}
ส่วนแบบนี้เคยเขียนถึงไว้แล้ว
html>body เว้นวรรค ตามด้วยคลาส ไอดี ที่คุณอยากจะสั่งมัน {}แบบนี้IE7 และ เบราเซอร์ใหม่ๆ อ่านได้ครับ เว้น IE6
เบราเซอร์ใหม่ๆ อ่านบรรทัดนี้ยกเว้น IE7
html>/**/body เว้นวรรค ตามด้วยคลาส ไอดี ที่คุณอยากจะสั่งมัน {}
ลองนำไปประยุกต์ใช้กันดูครับ เผื่อว่าใครอยากจะทำเว็บให้ support IE7 ด้วย
update 4 Jul 2007
อธิบายเพิ่มเติม
ถ้าเราเขียน
.ss{margin:10px 5px 5px 5px}
เบราเซอร์อื่นทำงานปกติ สมมติว่า ie7 ไม่เป็นไปตามนี้ อาจเป็นเพราะ อะไรก็แล้วแต่ ซึ่งก็ไม่รู้เหมือนกัน เราก็แฮ็กให้ ie7 เท่านั้นจะทำตามบรรทัดล่างนี้ เช่น
*:first-child+html .ss{margin:7px 5px 5px 5px} ie7 ก็จะอ่านบรรทัดนี้ครับ ซึ่งเราจะแก้ไขค่าข้างใน อะไรก็แก้ไป ให้ preview มาแล้วมันดูดีเหมือนเบราเซอร์อื่น
ส่วน *:first-child+html คำนี้มาจากไหน มีเหตุผลอะไร ทำไมต้องเขียนแบบนี้ ต้องบอกตามตรงว่า ไม่ทราบครับ รู้แต่ว่าเป็นช่องโหว่ของเบราเซอร์ ที่เมื่อเขียนแบบนี้แล้ว จะทำให้ ie7 อ่านได้แต่ เบราเซอร์อื่นจะไม่เห็น การ hack ของแต่ละเบราเซอร์ แต่ละเวอชั่น ก็จะมีรูปแบบต่างกันไปครับ
Permalink
พฤษภาคม 29, 2007 at 1:47 pm
· Filed under CSS hacks
Conditional comments
เป็นส่วนคอมเม้นท์ที่ใช้กับ IE ใช้เมื่อเวลาเราทำหน้าเว็บเขียน css เสร็จแเรียบร้อยแล้ว เบราเซอร์อื่นทำงานปกติดี หน้าตาสวยงาม แต่ IE เจ้ากรรม ดันแสดงผลไม่เหมือนชาวบ้านเค้า เราก็ต้องเขียน css เฉพาะของ IE ขึ้นมา เพื่อทำงานทับบางส่วนที่เสียหาย ให้คุณเพิ่มโค้ดนี้ในส่วน head แต่ให้อยู่ใต้การเรียกไฟล์ css ของหน้าที่ต้องการแก้ เพื่อให้คอมเม้นนี้อยู่ด้านล่าง
<!–[if IE 6]>
ใส่ตั้งแต่ <style type=”text/css”>……….จนปิด </style> css ในส่วนนี้จะถูกอ่านที่เบราเซอร์ IE6
<![endif]–>
มีการใช้หลายๆแบบดังนี้
อ่านต่อ คลิกที่นี่ »
Permalink
พฤษภาคม 15, 2007 at 5:06 pm
· Filed under CSS hacks
การ filter เป็นการ hack วิธีหนึ่ง เป็นการจำกัด เบราเซอร์ที่จะแสดงผล ตัวอย่างเช่น
<style type=”text/css”>
*html body{background:green}
html>body{background:black}
</style>
ลองเอาโค้ดนี้ ใส่ไว้ในส่วน head ของเว็บเพจ แล้วลอง previewด้วย IE และ Firefox จะเห็นความแตกต่าง นั่นคือ IE จะสามารถอ่านบรรทัดบน ที่มี * ได้ ส่วน browser อื่นที่ไม่ใช่ IE จะไม่สามารถอ่านบรรทัดบน แต่จะอ่านบรรทัดล่างที่มีเครื่องหมาย > ได้ ดังนั้นเมื่อเปิด ด้วย IE เราจะเห็น bg เป็นสีเขียว เมื่อเปิดด้วย browser อื่น จะเห็นเป็นสีดำ อ่านต่อ คลิกที่นี่ »
Permalink
พฤษภาคม 7, 2007 at 11:19 pm
· Filed under CSS hacks
การ hack ในที่นี้ ไม่ได้หมายถึงว่า เราจะไปเจาะระบบ หรือจะไปทำให้ใครเดือดร้อน
แต่จากที่เราได้รู้กันมาว่า การแสดงผลหน้าเว็บเพจ ของเบราเซอร์แต่ละตัวนั้นต่างกัน ก็เนื่องมาจาก มีการอ่านโค้ดที่ต่างกัน ดังนั้นเราจะอาศัยช่องโหว่ตรงนี้เขียนโค้ด เพื่อควบคุมให้เบราเซอร์แต่ละตัว อ่านค่าตามที่เราต้องการ การ hack นั้น มีหลายรูปแบบ โดยจะค่อยๆแนะนำไปทีละรูปแบบนะครับ
-ขอเริ่มจากรูปแบบที่ผมใช้บ่อยที่สุดละกันนะครับ ก่อนอื่นทบทวนกันสักเล็กน้อย ทุกคนคงทราบแล้วว่า css นั้น อ่านค่าจากบรรทัดบนลงล่าง ถ้าเราเขียนว่า อ่านต่อ คลิกที่นี่ »
Permalink