CSS hacks

ควบคุม เบราเซอร์ ดั่งใจ ด้วย hack

CSS hack for Chrome


ทุกวันนี้ Browser Google Chrome ได้ถูกใช้งานอย่างแพร่หลายในประเทศไทยแล้ว จากการที่ทางกูเกิลเองได้ทำการโปรโมทอย่างต่อเนื่อง และเพราะข้อดีของตัวเบราเซอร์เองที่มีความเร็วในการโหลดรูปได้เร็วกว่าเบราเซอร์หลักอื่นๆ ซึ่งตัวผมเองก็มักจะใช้ กูเกิลโครม ในการเข้าหน้าเว็บที่มีการโหลดรูปเยอะๆ เช่น เว็บอ่านการ์ตูนออนไลน์ เว็บขายสินค้า

แต่หลักๆแล้วก็ยังคงใช้ Firefox อยู่เพราะจำเป็นต้องใช้ Add-ons หลายอัน เมื่อกูเกิลโครมถูกใช้มากมายเช่นนี้แล้ว การจะละเลยโดยทำหน้าเว็บให้ดูได้สมบูรณ์ที่ firefox และ IE เท่านั้นก็ดูจะไม่ใช่เรื่องที่ดีอีกแล้ว อย่างน้อยควรจะ support IE Firefox Chrome Safari
Read more…

Related Articles

Share
Categories: CSS hacks
Tags:

CSS Hack IE7

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 ของแต่ละเบราเซอร์ แต่ละเวอชั่น ก็จะมีรูปแบบต่างกันไปครับ

Related Articles

Share
Categories: CSS hacks
Tags:

Conditional comments for IE

Conditional comments

เป็นส่วนคอมเม้นท์ที่ใช้กับ IE ใช้เมื่อเวลาเราทำหน้าเว็บเขียน css เสร็จแเรียบร้อยแล้ว เบราเซอร์อื่นทำงานปกติดี หน้าตาสวยงาม แต่ IE เจ้ากรรม ดันแสดงผลไม่เหมือนชาวบ้านเค้า เราก็ต้องเขียน css เฉพาะของ IE ขึ้นมา เพื่อทำงานทับบางส่วนที่เสียหาย ให้คุณเพิ่มโค้ดนี้ในส่วน head แต่ให้อยู่ใต้การเรียกไฟล์ css ของหน้าที่ต้องการแก้ เพื่อให้คอมเม้นนี้อยู่ด้านล่าง

<!–[if IE 6]>

ใส่ตั้งแต่ <style type=”text/css”>……….จนปิด </style> css ในส่วนนี้จะถูกอ่านที่เบราเซอร์ IE6

<![endif]–>

มีการใช้หลายๆแบบดังนี้

Read more…

Related Articles

เขียน css ให้แสดงผลเฉพาะbrowser

การ 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 อื่น จะเห็นเป็นสีดำ Read more…

Related Articles

Share
Categories: CSS hacks
Tags: