วิธีการสร้าง: เพิ่มภาพที่ประกอบ

เรียนรู้วิธีการเพิ่มสไตล์ภาพที่ประกอบ

ภาพฟิลเตอร์

CSS filter แอตทริบิวต์เพิ่มสไตล์ภาพที่ประกอบ (เช่น ภาพมัวและสัดส่วน)

注意：Internet Explorer, Edge 12 หรือ Safari 5.1 และเก่ากว่าไม่สนับสนุน filter แอตทริบิวต์

เปลี่ยนสีของทุกภาพเป็นขาว-ดำ (100% ขาวดำ):

ภาพต้นแบบ

สีขาว-ดำ (100%)

img {
    -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
    filter: grayscale(100%);
}

ใช้ภาพมัวสำหรับทุกภาพ:

ภาพต้นแบบ

ภาพมัว (5 พิกเซล)

img {
  -webkit-filter: blur(5px); /* Safari 6.0 - 9.0 */
  filter: blur(5px);
}