CSS3 ile Grayscale (Gri Tonlamalı) Filtre Kullanımı

CSS3 ile bir resimi gri tonlamalı bir şekilde gösterebileceğimiz örneğimiz

Mevcut bir projede oluşturduğum slider içindeki resimin gri tonlama şeklindeki hali de lazımdı. Photoshop harici ne ile yapılır diye ararken CSS3 ile yapıldığını görünce sizinle paylaşmak istedim. Kod betiklerimize geçelim.
CSS3 Grayscale
.gri{ 
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  filter: url(grayscale.svg); /* Firefox 4+ */
  filter: gray; /* IE 6-9 */
}

Örneği test etmek için resimin üzerine geliniz.
Örnek
CSS3 ile Grayscale (Gri Tonlamalı) Filtre Kullanımı

Yorumlar

Henüz hiçbir yorum yazılmamış. İlk yorumu siz yapın.

Yorum Yaz

Avatar

REKLAM

DDos Koruma, Botnet Koruma, Layer 7 Saldırı koruması, Sanal sunucu, Vds sunucu

REKLAM

Çizgi Filmler

EN

  • Popüler
  • Yeni
  • Son Yorum