Sepia fonksiyonu
sepia fonksiyonu,
bir arka plan görüntüsünü sepya'ya -
kahverengi tonlu siyah-beyaz bir görüntüye -
dönüştürmenizi sağlar. 0 değeri,
görüntünün orijinal halinde kalacağını belirtir.
100% veya 1 değeri, arka planı
tamamen sepya'ya dönüştürür. Bu aralıkta yer alan
herhangi bir sayı, sepya uygulamasını doğrusal olarak
belirler. Negatif bir değer belirlenemez.
Varsayılan değer 0'dır.
Sözdizimi
seçici {
filter: sepia(sayı);
}
Örnek
Resmimizi tamamen sepya yapalım:
<div id="elem"></div>
#elem {
filter: sepia(100%);
background: url("bg.png") center / cover no-repeat;
width: 400px;
height: 300px;
border: 1px solid black;
}
:
Örnek
Şimdi sepya uygulamasını
50% olarak azaltalım:
<div id="elem"></div>
#elem {
filter: sepia(50%);
background: url("bg.png") center / cover no-repeat;
width: 400px;
height: 300px;
border: 1px solid black;
}
:
Örnek
Şimdi sepia
fonksiyonuna 0'a eşit
bir değer verelim:
<div id="elem"></div>
#elem {
filter: sepia(0);
background: url("bg.png") center / cover no-repeat;
width: 400px;
height: 300px;
border: 1px solid black;
}
:
Ayrıca bakınız
-
arka planı bulanıklaştıran
blurfonksiyonu -
arka plana parlaklık veren
brightnessfonksiyonu -
arka plana kontrastlık veren
contrastfonksiyonu -
arka plana gölge veren
drop-shadowfonksiyonu -
arka plana renk tonu döndürme uygulayan
hue-rotatefonksiyonu -
arka plan renklerini tersine çeviren
invertfonksiyonu -
arka plana saydamlık veren
opacityfonksiyonu -
arka plan için kısaltılmış özellik olan
backgroundözelliği -
bir bloğa arka plan resmi vermek için kullanılan
background-imageözelliği -
arka plana stil veren
filterözelliği