For example, the HTML tag for a paragraph is <p>. Now suppose we want the paragraph below to stand out from the rest of this post by adding background color, we can do that by using inline CSS.
The hexadecimal color code for the background color of this paragraph is #FFD4FF. I obtained this hexadecimal color code by using a free tool ColorPic. I set the color of this paragraph to have a different background color by surrounding the text I am now typing with the a pair of HTML tag for paragraph <p style="color:#FFD4FF;"> and </p>. To make this clearer, I will display what I am now typing by making this into a graphic and upload it as an image below for you to study:

Well, the text in the above image is a bit small. To make it clearer, I will redo the graphic below so the text is larger and clearer:

I am a new convert to blogging, and I have a quesion for you. Can you tell me how to change my font and text size while posting? I do not even have the option to do so. Also, while I am writing a post if I upload a picture it shows up as words, I guess this is the code, but how can I change that? I hope these quesions are not too remedial, for I am new at all of this. Thanks in advance.
ReplyDeleteYou are preparing your post in the EDIT HTML mode which is the best because it can give you better control over your blog. If you wish, you may change over to the COMPOSE mode.
ReplyDeleteRegarding photos, those "words" instead of photo you saw are the HTML which are instructions to the web browser on how to display the photo on the web. I suggest you look at
uploading and manipulating photos
manipulating photos part 2
advice to complete alt=""
Thank you for your quick response, but there is still a small problem. You said this was Dummies Guide to Blogger, so I hope you mean it. While composing my post, the tabs to switch between modes(HTML/Compose) are not even there. Any other suggestions?
ReplyDeleteTry missing COMPOSE/EDIT HTML tabs. Will appreciate feedback as whether that helped.
ReplyDeleteHow to resize images in blogger to maximum size when mouse hovers on them..?
ReplyDeletehttp://www.itsteekays.blogspot.com
You mean a tool tip showing what you put in the title="" tag. If so, refer to Tip: complete the alt for images
ReplyDeleteHi there
ReplyDeleteCan I ask a question which isn't related to this text.
I set up a blog and after an argument the people I invited to help out on the blog deleted me from my own blog.
Is there any way I can delete the blog as the founder?
Thanks for your help.
Hi Peter... When I post a new blog I dont get the color palette to change th font color of my blog... I only get options to change it into Bold, italic and adding link and images. How can I change it? Please help me for it.. I have been asking this question to many people but no one has answered...
ReplyDeleteHello!
ReplyDeleteCan you tell me how to change the background color of only the center post section and not the sidebars? I have a 3 column blog on Blogger and I like the 3 columns, but i think the center post section needs to stand out a little. Or can I add vertical lines to separate the sidebars from the center section?? I've looked at my template, but I don't know CSS, so I'm afraid to go changing things! I do know quite a bit of HTML, but not CSS. THanks!
Hi Peter...
ReplyDeleteIn my blogspot..I do not find any color palette. As in when I go for new post I only find the options for change to font size, and bold italic. In my cetrtain blog friends blog they have the color palette so that they can select some text and change there color...
Please help me for it...
Hi Arizona,
ReplyDeleteI have lots of emails and comments to respond to, so I hope you will create a test blog and test this:
Go to LAYOUT then EDIT HTML and look for these codes in the template editor:
.post-body {
margin:0 0 .75em;
line-height:1.6em;
}
Add bg-color:red;
so that it becomes
.post-body {
margin:0 0 .75em;
line-height:1.6em;
bg-color:red;
}
If that don't work, try
.post-body {
margin:0 0 .75em;
line-height:1.6em;
background-color:red;
}
Only if successful, redo it in your actual blog.
Please let me know if you succeed or not
BTW I am trying to categorize my readers according to country. Which country are you from? I am from Malaysia.
Peter @ Enviroman (Blog*Star)
Blogger Tips and Tricks
Chippy-parro,
ReplyDeleteI suspect you are using the EDIT HTML mode (my favorite) while your friends are using COMPOSE mode (I never use this mode as it gives me less control and choices).
Hi, Peter
ReplyDeleteObliquely relevant query for you. To create a line-break in the Blog Description header - does this have to be done via HTML? If so, how?
Best Regards
Tony in UK
Type <br /> where you want a line break. Please let us know if that is successful.
ReplyDeletePeter,
ReplyDeleteWorked perfectly. Thanks for your prompt response. Keep up the good work.
Supplementary Q, Peter. What is the HTML for italics in the header?
ReplyDeleteBest
Tony
<span style="font-style:italic;">these text are in talic</span>
ReplyDeleteThanks again Peter.
ReplyDeleteHow to do the same block background for whole sidebar title?
ReplyDeleteHi Peter,
ReplyDeleteI've been looking all over, and I can't find any help for my question.
I am using the Scribe template in blogger, but the leading in the post is very small. I want to increase the space between the lines. My understanding is that I should increase the line-height, but this isn't working.
I thought I would need to edit this section:
body {
margin:0;
padding:0;
font-size: small;
text-align:center;
color:$textColor;
line-height:1.3em;
background:#483521 url("http://www2.blogblog.com/scribe/bg.gif") repeat;
}
When I change font size above from SMALL to LARGE, the font of my post does change to large. But I can change the line-height to any number (i.e. 20em), and it makes no difference.
I also tried changing the line-height here:
.post {
margin-top:8px;
margin-$endSide:0;
margin-bottom:24px;
margin-$startSide:0;
line-height 1.5em;
}
This didn't affect the post, either.
I saw another person using this same template with bigger leading. Can you please advise? This i akeing me crazy!
Mariel
Which website has what you want? Maybe you can go to that website, view page source code and see if that gives you some clue as to what can be done.
ReplyDeleteGreat stuff!! Thanks for sharing!!
ReplyDeleteRegards,
brochure design
sorry for the trouble. i'm turning around my blog and i can not see how to solve this. http://mihaelasurugiu.blogspot.com/ is the name of the blog. and i've put some pages as you can see. but there are underlined. and i don't know how to make it without underline. i've used everywere the text decoration:none. i cand send you the code if you may help
ReplyDeleteAre you saying that you have created some static Blogger pages? and the text in these pages are all underlined?
ReplyDeleteyes. i've used the pages from blogger.
ReplyDeleteyes
ReplyDeletetext decoration:none
ReplyDeleteshould be
text-decoration:none;
???
it is with ; i will send you by mail the code. i've searched the internet for my problem and find that it might have something to do with links beeing used. but if is true i can not find where or how to modify this.
ReplyDeleteI don't have enough info to help you. I cannot understand how links can give you that problem. If you have more info, let me know.
ReplyDeletehttp://mihaelasurugiu.blogspot.com/ that is the blog. as you can see the pages are underlined. but it's no problem if you can't help. you've done already enough with your blog. thank you
ReplyDeleteThank you for the work you have put into your post, it helps clear up some questions I had.
ReplyDeleteBrochure Design Services
Dear Peter
ReplyDeleteCan I ask a question? Do you have time.
Thanks
Regarding?
ReplyDelete