How Change Background And Text Color Of Blogger



How to Change Background And Text Color Of Blogger template as is very easy task which can be done without any problem.If you still think you really doesn't know anything about codes and to do it is really a big problem then don't miss even a single post from this blogger design series.If you want from start just start reading my all posts on design from beginning which explain all codes to blogger used in its design on how to make your own blogger template.

Today i will be going to explain on the next part of codes coming in blogger template. and codes define the body section of your template.Below are the codes.

Click the image To View Large




body {
background:$bgcolor;
margin:0;
color:$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
}


The body element defines the document's body.The body element contains all the contents of an HTML document, such as text, hyperlinks, images, tables, lists, etc and after defining all these the tag is closed at end.

So we start with writing body {
this symbol means we have started defining css for body and will close it when it will be complete with opposite symbol } and this tells the css for body has been defined.

Now in body css comes the next line background:$bgcolor; this line defines the background color of your template. But the color defined here is $bgcolor. So which color it is.

As i have also told you before on how to change the colors for blogger template in the previous post.There $bgcolor would have been defined in variable definitions,that color would be your blogger template background color.If you want to change it you can change $bgcolor it from there.

And one more is to just write color code in place of $bgcolor that color will be used as we use this way to design new blogger template like this background:#000000;.

You can get all color codes from here.

You can also use any image for you blogger background just write the above line like this.

background:url(http://url_of_the_image);

Your image will be used in place of color.

Now comes margin:0;.Now what does this tag do.As its clear from its name it defines all the space around the elements for which it is being defined,like you added any header in your template and now you want little spacing to it from top,below,left or right.So you have to use this to get space for the element from any part around it.

In full it can be defined as

margin:5px 10px 5px 10px;

That tell the

margin-top
margin-right
margin-bottom
margin-left

all 4 things define these 4 margins above from all four sides.

Then comes color:$textcolor; as this too is same to define color of your text as you can change it in by replacing text color code with $textcolor or just change $textcolor from from visiting this post.


Now come these lines

font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;


telling font and size of text to be used,you can define it as you want.As font defined is georgia you can define any one you want like arial,times roman anything you want.

Now the size has been given small you can give it medium,normal or large.

you can also define size in specific measure like this.

font-size:12px;

now this line text-align: center;

This aligns the text to the centre you can make it to align left or right also by just changing center to left or right.

and after defining all these the css for body tag ends with this symbol }.

5 comments:

ROYgBIV said...

im confused, how do i JUST get my text to be green?

InnocentlyHarmed said...

I am using a template created by another blogger. I would like to change the text color of my posts. How do I do it? None of the above apply for me.

Anshul said...

@innocent as i said if designed by designer he would have defined color acc to the design its difficult to tell where he defined,JUst i can help if you show codes to me,else you have to aware of codes to do yourself.

Natalie said...

I did what you did and found where the codes are listed.
I tried to change the text colour of my blog in "Edit HTML", but after I did, nothing happened.
I also tried to change the text colour under "Fonts & Colors" and nothing also happened.
Argh!!
I don't want to have to manually change the colour on every posting! What can I do?
PS - My blog template is from www.thecutestblogontheblock.com
Thanks so much!

Post a Comment