ที่มา
เอฟเฟกต์ฟิลเตอร์นั้นมีให้ใช้มาระยะหนึ่งแล้ว แต่ได้รับการออกแบบให้ทำงานใน SVG ได้ เทมเพลตนี้มีประสิทธิภาพสูงในการใช้เอฟเฟกต์ต่างๆ เช่น ความเข้มของสี การปรับให้ภาพบิดเบี้ยว หรือการเบลอรูปภาพ ก่อนการประกอบและแสดงผลในเอกสาร
เมื่อปี 2009 Mozilla บอกว่า SVG นั้นไม่เพียงพอ สุดท้ายพวกเขาได้ใช้ตัวกรองเพิ่มขึ้นอีก 1 ขั้นตอนและอนุญาตให้ใช้ในเนื้อหา HTML ใน Firefox 3.5 ดูการสาธิตฟิลเตอร์ SVG สไตล์คลาสสิกของพอล ไอริชใน <video> ที่เล่นอยู่ ขอย้ำอีกครั้งว่าใช้งานได้เฉพาะใน Firefox เท่านั้น แต่ยังแก้เข่าอยู่
วันนี้
Flash ไปข้างหน้าในช่วงสิ้นปี 2011 และ Adobe (รวมถึงบริษัทอื่นๆ) ก็ทำงานอย่างหนักเพื่อนำเทคโนโลยีที่น่าทึ่งนี้มาสู่ CSS กล่าวอย่างเจาะจงก็คือ เราหมายถึง CSSFilter Effects 1.0 ซึ่ง WebKit ได้เริ่มติดตั้งใช้งานแล้ว
การเปิดใช้ตัวกรองใน CSS โดยตรงหมายความว่าองค์ประกอบ DOM เกือบทั้งหมดสามารถใช้ประโยชน์จากองค์ประกอบเหล่านี้ได้ รูปภาพ, <video>, <canvas> คุณตั้งชื่อ
โปรไฟล์
ข้อกำหนดดังกล่าวยังกำหนดตัวสร้างเงา CSS ซึ่งจะนำเทคโนโลยีตัวปรับแสงเงา OpenGL มาสู่ CSS ในที่สุด เป็นเรื่องที่น่าตื่นเต้นมาก อย่างไรก็ตาม จะมีข้อควรพิจารณาด้านความปลอดภัยทุกครั้งที่คุณเปิด GPU ของระบบ ด้วยเหตุนี้ WebKit จึงมีฟังก์ชันตัวกรอง CSS ที่ใช้อยู่ในปัจจุบันเท่านั้น
การสนับสนุน
Chrome 18.0.976.0 (ปัจจุบันคือ Canary) Webkit ทุกคืน
ใน Webkit Nightlies คุณสามารถใช้ตัวกรองกับเนื้อหาที่มีการเร่งฮาร์ดแวร์ ( เช่น img { -webkit-transform: translateZ(0); }) ใน Chrome ตัวกรองเนื้อหาแบบเร่งยังอยู่ระหว่างดำเนินการ (ใช้แฟล็ก --enable-accelerated-filters) ซึ่งรวมถึง <video> ซึ่งมีการเร่งโดยค่าเริ่มต้น