Blogger Resimlerinize Özel Efektler Verin

Blog resimleriniz için beş harika CSS stillerinde farklı efekt ve gölgeler ile farklı bir blog tarzı sunabilirsiniz bu eklenti ile.Aşağıdaki beş stildeki şekiller ile daha güzel bir görünümde verebilirsiniz.Oldukça eklemesi basit bir eklenti sayesinde blogunuzdaki resimlere farklı özel bir efekt sunabilirsiniz.CSS stillerinin demosunu yazımın en altında sizlere paylaşıyorum kendinize uyanı ve güzel bulduğunuzu blogunuza ekleyebilirsiniz.

Blogger Paneline Girin. .

Şablon Tıklıyoruz > HTML Düzenle > CTRL+F yardımı ile ]]></b:skin> kodunu buluyoruz ve aşağıdaki kodlardan hangisini seçiyorsanız hemen üstüne yerleştiriyoruz

CSS STİL > 1

 .post-body img {
border:0;
padding:0;
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
}
.post-body img:hover {
box-shadow: 0px 0px 15px #000; /* Gölge */
border-radius: 50%; /* Yuvarlatılmış kenar*/
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
cursor:pointer;
}

CSS STİL 2 >>

 .post-body img {
background:#FFF; /*Çevresindeki arka plan rengi  */
padding:15px; 
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
}
.post-body img:hover {
box-shadow: 0px 0px 15px #000; /* Gölge*/
border-radius: 0% 50%; /* Yuvarlatılmış kenar  */
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
cursor:pointer;
}

CSS STİL 3 >>>

.post-body img {
background:#FFF; /* Çevresindeki arka plan rengi */
padding:15px; /* Sınır Arasındaki Boşluk ve Görüntü */
border-radius: 50% 0; /*  Yuvarlatılmış kenar */
box-shadow: 0px 0px 15px #000; /* Gölge */
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
}
.post-body img:hover {
border-radius:0; /* Bu işlem ile sınır yuvarlaklık (değeri 0) */
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
cursor:pointer;
}

CSS STİL 4 >>>>

 .post-body img {
box-shadow: 0px 0px 15px #000; /* Gölge*/
border-radius: 50%; /* Yuvarlatılmış kenar */
border:0;
padding:0;
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
}
.post-body img:hover {
box-shadow: 0; /* Bu gölge (değeri 0) */
border-radius: 0; /* Bu işlem ile sınır yuvarlaklık (değeri 0)*/
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
cursor:pointer;
}

CSS STİL 5 >>>>>

 .post-body img {
border-radius: 45% / 20%; /* Rounded border */
box-shadow: 0px 0px 15px #000; /* Gölge */
padding:0;
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
}
.post-body img:hover {
border-radius: 0; /*  Bu yuvarlaklığını sınır (değeri 0) */
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
cursor:pointer;
}