css: Make Bold Items STAND OUT
This one’s very easy, but it’s a great way to quickly increase the visibility of your bolded items.
Let’s say you have a gray color for your site’s font, but you want to make every bold item stand out in solid black. You could add unnecessary code such as <strong style="color:#000">BOLD</strong>
But that’s neither clean nor necessary. Instead, you can apply this directly to all instances of bold with css.
Just add this to your stylesheet:
strong{color:#000;}
Now, you will see that the bolded items stand out much more when compared to the rest of your text.
Of course, you aren’t just limited to changing the font’s color. For example, we have defined the strong tag as a block element when used within certain divs. This provides us with a way to make each strong tag fall on it’s own line, without having to add a<br /> tag. To do that, simply use this code:
#YOURDIVNAME strong{color:#000;display:block;}
You can see an example of this in action by viewing the source code of DynamiX Web Design under the “what makes us different” area.
Compatibility:
This method has been tested in and is compatible with Internet Explorer 5.5, 6, 7, Firefox (PC and Mac), Netscape and Safari (PC and Mac).
That’s all folks!
Thank you for taking the time to read one of our articles. If you still find yourself stuck, we’d be happy to lend a hand. Simply leave us a comment below, and we’ll do our best to help you out. Found something that we’ve missed? We’d love to hear it.
Tags: bold, css, html, increase visibility, stylesheets
