Kayıtlar

background-blend-mode etiketine sahip yayınlar gösteriliyor

CSS background-blend-mode Özelliği

CSS background-blend-mode Css background-blend-mode özelliği resimlere veya html elemanlarına görsel efektler uygulamak için kullanılır. Örnek: Şimdi arka plana atanan bir resim üzerinde resmin doygunluk ayarını değiştirelim. div { width: 250px; height: 250px; background-size: 250px 250px; background-repeat: no-repeat; background-image: linear-gradient(to right, black 25%, green 100%), url('smiley.jpg'); background-blend-mode: saturation; } Kendiniz deneyin » CSS background-blend-mode nedir nasıl kullanılır Css background-blend-mode özelliği ,herhangi bir renk yada resim atanan arkaplanların renkleri,doygunlukları ,parlaklıkları gibi özellikleri değiştirmemizi sağlayan, görsel efektler kullanabileceğimiz bir özelliktir. CSS background-blend-mode CSS background-blend-mode özellikleri   Varsayılan Değer: normal   Kalıtsallık: yok

CSS background-blend-mode Örnek

<!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8"> <title>css background-blend-mode örnek uygulama</title> <style> body {background-color: green;} div { width: 250px; height: 250px; background-size: 250px 250px; background-repeat:no-repeat; background-image: linear-gradient(to right, black 25%,green 100%), url('http://2.bp.blogspot.com/-qktKg-AKGrY/VhuQ-Q10tMI/AAAAAAAAA0s/cceCuUI-8ng/s1600/css-background-ozelligi.jpg'); background-blend-mode: saturation; } </style> </head> <body> </head> <body> <div></div> <article style="color:white;font-size:15px;"><b>Hatırlatma:</b> <strong> css background-blend-mode</strong> özelliğini internet explorer desteklemiyor</article> </body> </html>

CSS background-blend-mode Uygulama

CSS background-blend-mode #resim {<br>    width: 250px;<br>    height: 250px;<br>    background-size:  300px 300px;<br>    background-repeat: no-repeat;<br>    background-image: linear-gradient(to left, black 0%,white 100%), <br>    background-blend-mode:<span id='rfrnscsscde'> normal</span>;<br>}<br> CSS background-blend-mode değerleri normal multiply screen overlay darken lighten color-dodge saturation color luminosity Sonuç Ekranı HTML5 Dersleri Ve CSS3 Dersleri eğitimi sitesine hoş geldiniz.Sitede yüzlerce örnek ve uygulma bulabilirsiniz. HTML5 ile yeni gelen etiketler ve kullanımı hakkında bilgi sahibi olmak için HTML referanslar başlığındaki makaleyi mutlaka okuyunuz.. Sonuçları görmek