How To Add Border Around Post Images in Blogger

Sometime you wish that there should be some style to your blog images like drop shadow or borders. In this simple tutorial i will teach you to how to add border around your post images in blogger using few simple CSS Code. Lets do it!

How To Add Border Around Blog Images?

1. Go to Blogger > Template > Edit Html
2. Now search for ]]></b:skin> 
3. Copy/Paste the following code just above ]]></b:skin> 

/*–Mozpk.com–*/
.post img
{
border:1px solid #e3e3e3;
border-radius:10px;
padding: 10px;
}

4. Save the template and you are done.
5. Make following changes to change style, color or size of the border.

  • Increase 1px to increase the width of border
  • change solid to dotted or dashed to change style of border
  • Replace #e3e3e3 to change border color
  • Remove border-radius: 10px; to remove the radius around the corners

 

Leave a Reply

Your email address will not be published. Required fields are marked *

Next Post

Stylish Email Subscription Widget for Blogger Blog Code

Tue Nov 8 , 2016
I have previously share a tutorial on adding blogger default RSS subscription box. But the default form is not so cool and unattractive. In today tutorial i will share with you awesome subscription box styled with Html & CSS. This widget is simple and will blend in any blogger template. […]
Stylish Email Subscription Widget for Blogger