Css renk bazında transparan alan

Başlık biraz harbiden karışık oldu. Neyse ki içerik ve etiketlerden dolayı bu yazıyı buldunuz. Bu laubali girişten sonra konuyu açmak, geliştirmek ve sonlandırmak istiyorum. Resimdeki gibi sayfalarımızda div tag’ı ile açtığımız bir alanı transparan göstermek isteyebiliriz. Bunun için .png transparan resmi ile yapabilmekteyiz. Ama bazen resim yetmeye bilir. Css’in yeni teknolojisinde .png lerle uğraşmadan renk bazında transparan değeri verilebilir.

Bu şekilde background-color: rgb(255,51,0); renklendirdiğimiz bir div tagini alttaki kod gibi transparan değeri ekleyerek, opacity ile uğraşmadan arka planı gözüken şeffaf alan yapabiliriz.

[cc lang=”c#”]
.resimdekidiv {
width:300px;
height:200px;
border-bottom-color:#0C3;
background-color: rgba(255,51,0,0.5);
color:#FFF;
border-color:rgb(153,0,255);
border-width:3px;
border-style:solid;

}
[/cc]

Kodlar transparan resimdekidiv class’ının kodları.

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir