Highlight Text In Posts Through Colored HTML Text Boxes

By highlighting specific regions of your post/article, you make it easier for your readers to understand the post in a better way. Although in Blogger, you can tweak the quote boxes (like the gray boxes, I use in my blog to show HTML codes), but as it is done directly in the template of the blog, so it will be applied to the whole of your blog, and therefore the boxes will have same appearance every time you use them anywhere in the blog.
So here’s another easy method through which you can control and change all the settings like background color, text color size, font style etc. every time you use these boxes:
An example:

The Best way to make your dreams,
come true is to wake up.

To display a similar box in your blog, use this code:

<div align=”center”>
<div style=”background-color: #cccd94; border: 1px solid black; font-family: sans-serif; font-weight: bold; padding: 10px; text-align: center; text-transform: capitalize; width: 300px;”>
<i>The Best way to make your dreams,
come true is to <span style=”color: blue; font-weight: bolder;”>wake up.</span></i></div>
</div>

You can adjust the colored parts in the code to match your blog and requirements.

You may also like to read this post:
How to show different background color or image for separate posts or paragraphs.

Leave a Reply

16 Comments on "Highlight Text In Posts Through Colored HTML Text Boxes"

Notify of
avatar
Sort by:   newest | oldest | most voted
firdaus.a
Guest

Thanks for sharing ;P
nice simple tips.

View Comment
Play Games Win Prizes
Guest

This is the GREATEST way to make a reader pay attention to something important…or maybe a few links 😉

-Mike

View Comment
Sham
Guest

Small nice tip:)

View Comment
Anonymous
Guest

Thank you verrrrry much for this tip …

View Comment
bloggerstop.net
Guest
AB
Guest

Sorry dear, I really didn’t know about that mistake.

Check url :http://exclusivearena.blogspot.com/2009/05/blogger-widget-multi-drop-down-menu.html

View Comment
RV Quick Tips
Guest

Great tool to show some important information to the readers at first glance 🙂

becky.

View Comment
Maya Safana
Guest

its working good…… thanks so much…..
this my blog [ http://super-url.blogspot.com ] i used this…
thanks again….

View Comment
Anonymous
Guest

Worked great. Thanks so much.

View Comment
Anonymous
Guest

thanks for your help.
my quastion is..i want highlight my post title what should i do?
my post title in blogger is ( red line ) and i wanted to color it with red color but as you know the post title it comes in sapreate box so my quastion how would be change color for the title only ?

View Comment
~*Jessica Rabbit*~
Guest

Ah, thank you! This is by far the simpilist explination I have found so far. :-*

View Comment
h4ck3r14
Guest
Michael
Guest

This has been very helpful. For someone who don't know css styling or html (like me) I was able to make changes to my post's layout because of the tutorials I find here.

Keep up the great work. You guys are helping tons of blogger out there. Thanks!

View Comment
wpDiscuz