How To Highlight Certain Words in Your WordPress Blog

A really simple tip for those who is entirely blind to html. There will be times when you want to highlight certain words with a bright background to emphasize the importance of the words. There are two ways to achieve this. One is to add another class in your stylesheet so when you write a post you can simple tag them with your CSS stylings. This method has it’s limits as every word you tag will have the same highlight color.

A more versatile method will be to use the span tag. With this you do not need to add any CSS codes and you can choose any colors you like for every different word you want to highlight. For example:

<span style="background:#00FFFF">This is a Cyan background</span>

results in:

This is a Cyan background

<span style="background:#FFFF00">This is a yellow background</span>

results in:

This is a yellow background

You can go even further like specifying the size and color of the fonts

<span style="background:#00ffff; font-size:18px; font-weight:bold;color:#FF0000">This is bold text in red</span>

results in:

This is bold text in red

Or if you like, you can just colorize the fonts without any backgrounds

<span style="color:#ff0000">This is a red color font without background</span>

results in:

This is a red color font without background
<span style="color:#ffff00; font-size: 20px; font-weight: bold">This is bold red text without background</span>

results in:

This is bold red text without background

Let your imaginations fly.

Related posts:

1. CSS Codes To Highlight WordPress Post Background Color. Highlighting certain part of your post will attract your reader’s focus on something important that you might want to relate in your post. This following piece of codes will let you highlight the background of your post like what you are seeing now Read more on CSS Codes To Highlight...
2. How To Give Your Own Comments A Different Look In WordPress Making your own comments look different from that of your readers is such a simple mod that I am knocking my head as to why I took such a long time to find it. It just takes one simple line of css codes and we are done. You can...
3. How To Add Colors To Your Theme Sidebar There are times when you would like to add some color to your WordPress Theme’s sidebar to make it more unique, especially if you are using a free Theme which many others are using. There are a few ways to go about adding colors to your sidebars. Read more...
4. Add Text And Image Shadows To Your WordPress Post To add shadows to your text in your WordPress blog, all you need is a simple line of code. It works with all major browsers except Internet Explorer, which not too surprising. A lot of my modded themes appear different in that silly browser. Even Google Chrome, being a...
5. How To Align Your WordPress Quotes Left Or Right Image via Wikipedia Sometimes we will want to quote some phrases to make it more outstanding so as to grab the attention of our readers. Of course in WordPress there is a ‘blockquote’ tag which we can use and style to our fancy but how about when you want...

Tagged as: Cascading Style Sheets, Free WordPress Themes, WordPress Templates, WordPress Theme Modification, Wordpress Themes