How to add shadow in image in blogger

0 Yogendra Patel 7:09 PM

You can create an image attractive by using shadow or border-radius, code's are given below use this code in your post or article were you want to show image.

Shadow Code:- box-shadow: rgba(0, 0, 0, 0.8) 0px 0px 8px;

border radius Code:- border-radius: 10px;

Example:-

Preview:-

Normal image

After adding shadow

After adding shadow and border

Also You can use this in blogger theme - Edit Html section for easy access, first remove <style>and </style> tag and paste CSS Code above "]]></b:skin>"

then paste Html code in your post, and add download link, show you can easily use shadow box by just applying Html code in post.

HTML Code

 
<!----Post-Image Html Code---->

<div class="Post-Image">

   <img src="https://Imagelink.com"/>

</div>

CSS Code

   <!-----Post-Image CSS Code------>

<style>

.abc{}

.Post-Image {
     text-align: center;
}
  
.Post-Image img { 
     border-radius: 10px;
     margin: 10px 0 20px 0;
     box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
}

</style>