Функција sepia
Функцијата sepia овозможува
да се направи сепија од позадинската слика -
црно-бела слика со кафеав
нијанса. Вредноста 0 означува
дека сликата ќе остане оригинална.
Вредноста 100% или 1 целосно
ја претвора позадината во сепија. Секој број лоциран во
овој опсег ја задава примената на сепијата линеарно.
Не може да се зададе негативна вредност.
Стандардно вредноста е 0.
Синтакса
селектор {
filter: sepia(број);
}
Пример
Ајде да ја направиме нашата слика целосна сепија:
<div id="elem"></div>
#elem {
filter: sepia(100%);
background: url("bg.png") center / cover no-repeat;
width: 400px;
height: 300px;
border: 1px solid black;
}
:
Пример
А сега ајде да ја намалиме примената на сепијата
на 50%:
<div id="elem"></div>
#elem {
filter: sepia(50%);
background: url("bg.png") center / cover no-repeat;
width: 400px;
height: 300px;
border: 1px solid black;
}
:
Пример
А сега ајде да зададеме во
функцијата sepia вредност
еднаква на 0:
<div id="elem"></div>
#elem {
filter: sepia(0);
background: url("bg.png") center / cover no-repeat;
width: 400px;
height: 300px;
border: 1px solid black;
}
:
Погледнете ги и
-
функцијата
blur,
која ја заматува позадината -
функцијата
brightness,
која ја задава осветленоста на позадината -
функцијата
contrast,
која ја задава контрастноста на позадината -
функцијата
drop-shadow,
која задава сенка на позадината -
функцијата
hue-rotate,
која ја задава бојата на позадината -
функцијата
invert,
која ги инвертира боите на позадината -
функцијата
opacity,
која ја задава провидноста на позадината -
својството
background,
кое претставува кратенка-својство за позадината -
својството
background-image,
со кое на блокот може да му се зададе позадинска слика -
својството
filter,
кое го задава стилот за позадината