How to Add Border on Image in Blogger

Socialize It →

Tweet

2

Advertisements

Are you looking to add border to your images in Blogger? Sometimes adding border to images can make them standout in your content. Recently, one of our users asked us how to add border around an images in blogger. Though, it is very simple and can be done easily but new bloggers find it difficult. In this article, we will show you how to add border around an image in blogger.

To add border around images you need to write simple codes of CSS. With these codes you can easily add different kinds of borders having any colors that you want.

The very first thing you need to do is to login to Blogger.com >> Template >> Edit HTML >> Search for the b:skin>> tag. After finding the skin tag, just above it paste the following code:

.post img {
border:5px solid #d2d2d2;
padding:2px;
}

In the above code you can change the #d2d2d2 with any other hex color to alter the color of your border. You can also increase the above 2px to a higher number to increase the blank space arround the border.

Furthermore you can also use different types of borders in your images, following are some border types that you can use:

1. solid: Defines a solid border
2. dotted: Defines a dotted border
3. dashed: Defines a dashed border
4. double: Defines two borders. The width of the two borders are the same as the border-width value
5. groove: Defines a 3D grooved border. The effect depends on the border-color value
6. ridge: Defines a 3D ridged border. The effect depends on the border-color value
7. inset: Defines a 3D inset border. The effect depends on the border-color value
8. outset: Defines a 3D outset border. The effect depends on the border-color value

Once you are done customizing your image border, press the "Save Template" button present at the very top of your screen. 

We hope this tutorial may have helped you in learning how to add border around an image in blogger. Though the technique is very simple but still for beginners it might be a very tough task. However, share your thoughts below and also share it on Facebook, Google+ or Twitter. 

Advertisements

About the Editorial Team

The Editorial Team of MyBloggerLab consists of a group of Professional Blogger geeks Led by Syed Faizan Ali (Founder of MyBloggerLab).