Template Blogger Tutorial Part 2

Yesterday i was posted an article about blogger template tutorial. I will continue this tutorial. Before we learn how to make or customize our template, i think we should know about CSS (Cascading Style Sheets) and HTML (Hypertext Markup Language). There are important thing for our template. Now, i start to continue of blogger template tutorial with explaining about CSS.

Cascading Style Sheets (CSS) is a style sheet language used to describe the presentation (that is, the look and formatting) of a document written in a markup language. Its most common application is to style web pages written in HTML and XHTML, but the language can be applied to any kind of XML document, including SVG and XUL.CSS is designed primarily to enable the separation of document content (written in HTML or a similar markup language) from document presentation, including elements such as the colors, fonts, and layout.

Usually in blogger template, CSS code was placed in head area (between <head> and </head>). Look up for this picture.

In this picture, there are several CSS code for body and outer wrapper. In that CSS there are curly bracket {}, (:), and (;). There is the rules when we write CSS. When you write CSS, you place the declaration within curly brackets {}. Properties and values are separated by a colon (:), and property/value pairs are terminated by a semicolon (;).
There was background, width, padding, margin, border word in that example picture. To know what is the meaning of that word, look up for this picture.

For example:

body {
background: #AAAAAA;
width: 990px;
color: #202020;
font-size: 12px;
font-family: Arial, Tahoma, Verdana;
margin: 0px auto 0px;
padding: 0px;
}

Body area with width 990px and background color is grey (#AAAAAA), and than color of body content is black (#202020) with font size 12 px and font type is arial, tahoma or verdana. Body area have margin 0px auto 0px, this have a meaning this area will have margin-top 0px, margin-right and bottom auto (will be center) and margin-left also 0px. and the content of body will have margin 0px.
Also, there are some area that are use picture as background. To apply your favorite background, we must add picture url to CSS code, like this one.