Monday, December 31, 2007

Adding Background Image!!!

I want to share this tip for blogger friends. Maybe some of you already known this tip. If you don't know that yet. This post will be useful for you. And I also want to write this post no matter what :D.

Changing Background Color(Optional)
for background
body {background:$bgcolor;

replace like that....
body {background-color:#B38481;

for sidebar
#sidebar-wrapper {background-color:#B38481;

for post body
#main-wrapper {background-color:#B38481;

Changing Backgroound Image(Optional)
for background
body {background-image: url(URL of your image file);

for sidebar
#sidebar-wrapper {background-image: url(URL of your image file);

for post body
#main-wrapper {background-image: url(URL of your image file);

Repeating Background Image

1.background-repeat: no-repeat;
2.background-repeat: repeat-x; //repeat horizontally
3.background-repeat: repeat-y; //repeat vertically

Positioning Background Image(can only used for no repeat image)
background-position: top left;

you can replace...
top center;
top right;
center left;
center center;
center right;
bottom left;
bottom center;
bottom right;

Fixed position Background Image
By default,the picture scrolling around when you move the scroll wheel.If you don't want put that code..
background-attachment: fixed;

When you finished with these codes the CSS code will be like following:
body {
background-color: #B38481;
background-image:(URL of your image file);
background-repeat: no-repeat;
background-position: center center;
background-attachment: fixed;

You can also write like that...
body {background:#B38481 url(URL of your image file) no-repeat center center fixed;


I'll continue on more Blogger Tips if you buy me a drink......:D




No comments: