Informer's World

As we all know, Blogger is based on Cascading Style Sheets (CSS). Adding, styling and customizing the borders are easy to implement as it uses the CSS Properties. With the help of borders, you can separate the different sectors of your blog, such as headers, sidebars or can be used to highlight the blockquotes and featured contents.

A blog designer can easily make a beautiful template just using borders and background colors.

Let us see how to style and customize the borders with some examples.

















Now let us have an explanation.

Property "border" is used to add the borders while "3px" describes the width, "dotted" describes the type and "orange" describes border color.

More properties can be used for different borders for different sides.

To show border to top: border-top, to bottom : border-bottom, to left : border-left and to right : border-right.

Lets see a working example:



To implement these border styles and customizations in Blogger templates (or in CSS), you have to first decide where you want it. For example, if you want to style the header section, then find:

#header-wrapper {

(more properties here)

border: 3px outset #215670;

}

Likewise you can also add borders to your Post Sections (#main-wrapper, #main), Sidebars (#sidebar-wrapper, #sidebar) or to Footer Section (#footer-wrapper, #footer). More details can be found in W3 School.