Tweaking your stylesheet (in Blogger)

Here is a line of code from a default blogger template that might not make sense to you:

body {
background:#fff;
margin:0;
padding:40px 20px;
font:x-small Georgia,Serif;
text-align:center;
color:#333;
font-size/* */:/**/small;
font-size: /**/small;
}
a:link {
color:#58a;
text-decoration:none;
}

Here is that “de-coded”:

We’re working with the body { of the page; the whole thing.
background:#fff; The page’s background is white. To change this color, pick another Hex color value.
margin:0; The page does not have a margin around it. To flow your text or boxes all the way out to the edge of the page, leave this at 0. To make a space around the content, change it to 5px or so. “px” is pixels.
padding:40px 20px 30px 90px; Around your actual content, there should be a margin of 40px on top, 20 px to the right, 30 px to the left and 90 px below. The measurements move in the clockwise direction starting with noon.
font:x-small Georgia,Serif; The font for the whole page is extra small and in the Georgia script. You can change the font size to “x-large,” “large,” “medium,” “small,” “x-small,” or “xx-small.” The last one is a little hard to read. “Serif” means if the browser does not have the Georgia font, it will default to another font with “Feet” or “Serifs.” Other common “sans-serif” fonts or those “without-feet” are Arial, Helvetica and Verdana. Stick some of those in there for Georgia.
text-align:center; The text is generally aligned in the middle of the page. If you get down later in the page, the text might be aligned left, right or justified. You can change this value from “center” to “right,” “left” or “justify.”
color:#333; The font color is #333 or grayish. Again, check the link to the Hex color generator I included above. Play around with that.
}
a:link {
color:#3366cc; Links are blue here. You can change the color.
text-decoration:none; Links are not underlined. You can change the value from “none” to “underline,” “bold,” “italic” or others.
}

Comments »

The URI to TrackBack this entry is: http://busyjournalist.com/tech/2005/10/13/tweaking-your-stylesheet-in-blogger/trackback/

No comments yet.

RSS feed for comments on this post.

Leave a comment

Line and paragraph breaks automatic, e-mail address never displayed, HTML allowed: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <code> <em> <i> <strike> <strong>