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

เขียน 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 อื่น จะเห็นเป็นสีดำ

เราสามารถเลือกใช้รูปแบบใดแบบหนึงก็ได้ โดยการเขียนไว้บรรทัดล่าง เช่น

<style type=”text/css”>
ul li{color:green}
ul>li{color:blue}
</style>

IE จะอ่านบรรทัดบน ทำให้ตัวหนังสือใน li เป็นสีเขียว ส่วน เบราเซอร์อื่น อ่านบรรทัดบนเช่นกัน แต่สามารถอ่านบรรทัดล่างได้ด้วย ทำให้ บรรทัดที่อ่านสุดท้ายทำงาน จะได้ตัวหนังสือใน liเป็นสีน้ำเงิน

รูปแบบที่มักจะนิยมใช้คือ

*html body .class1{……..} หรือ
html>body #header{………}

เป็นการเขียนให้มี ความสำคัญสูงๆ ไม่ให้มี class หรือ id อื่น มาทำงานทับได้  เพราะเราต้องการ hack ให้อ่านบรรทัดนี้

Related Articles

  • Share/Bookmark
Categories: CSS hacks
Tags:

About the author

Webmaster ของเว็บนี้และ www.toysmile.com กับ www.wondercutie.com ความสามารถ : web design, graphic design, CSS, PHP programming, wordpress, magento ตอนนี้กำลังสนใจ : การออกแบบ ตัวการ์ตูน คาแรคเตอร์ ^^

Website : http://www.divland.com

Facebook : http://www.facebook.com/divland

Twiter : http://twitter.com/divland


  1. September 13th, 2007 at 21:59 | #1

    ทำไมหน้าเว็บเวลาเปิดดูบน IE6 มันดูดี แต่เวลาเปิดดูบน IE7 แล้วมันแตกกระจายดูมั่วไปหมดครับ..มีวิธีแก้ไหมครับถ้าเราต้องการให้มันแสดงเหมือนกันทั้ง 2 ตัว:(

  2. September 14th, 2007 at 10:35 | #2

    มีครับ แต่ต้องดูโค้ดก่อนครับ ว่าเขียนอย่างไร จึงจะแนะนำวิธีแก้ได้ถูก เอาโค้ดมาโพสต์ที่บอร์ดก็ได้ครับ

  3. September 18th, 2007 at 01:23 | #3

    คือว่า..อยากจะทราบแนวทางอ่ะครับ..เพราะที่ทำไปแล้วมันพังและ โค้ดยังไม่ได้เขียนใหม่เพราะกลัวเจ้งอีกอ่ะครับ…มี โค้ดอะไรบ้างที่แทรกลงไปแล้วทำให้การแสดงผล ไม่ผิดรูปแบบอ่ะครับหรือวิธีไหนที่ทำให้เว็บเราไม่แตกกระจายเวลา เปิดดูบน IE7 เพราะตอนเขียนใช้ IE6 เขียนอ่ะครับ:(

  4. February 22nd, 2008 at 11:13 | #4

    ปัญหาของผมตอนนี้คือไม่ว่าจะไฟร์ฟอกหรือIE
    ทำไมมันอ่าน*และ>ผ่านหมดอะครับ

    เครียดๆๆๆๆ

  5. February 22nd, 2008 at 14:57 | #5

    ลองดูที่ doctype ครับ ว่าใช้ถูกรึป่าว

  6. Arts
    October 1st, 2008 at 15:29 | #6

    เพิ่งจับ css ในการทำ layout ครับ เพื่อนๆพอจะลำดับการการศึกษา css อย่างไร ดีครับ

    ขอบคุณ

  7. October 1st, 2008 at 23:49 | #7

    ก้เริ่มจาก กฎ ต่างๆครับ มีไม่เยอะครับ จากนั้นก็ลองทำ layout ดู แล้วก็ ทำพวกกล่อง ครับ

  8. September 17th, 2009 at 15:04 | #8

    เบื่อกับ ie ค่ะ แต่ละเวอร์ชั่นแสดงผลไม่เหมือนกันเลย

  9. December 5th, 2009 at 22:02 | #9

    Thank you for good information

  10. December 5th, 2009 at 22:03 | #10

    แนวนี้ชอบมากเลยครับ

  11. April 15th, 2010 at 13:51 | #11

    ขอบคุณมากครับผม

  1. No trackbacks yet.