How to Change the Color of All Bold Text in HTML

Web pages written in Hyper-Text Markup Language (HTML) get their styling - colors, fonts and other design touches - from Cascading Style Sheet (CSS) code. Using a style sheet, you can change the way browsers display certain HTML tags. For example, you can tell the browser to make all text between tags red. Since tags make text bold in most browsers, this will change the color of the bold text on your website. If your site uses tags to make bold text, you would target that tag in CSS instead.

...
Use CSS to change the color of bold text in HTML files.

Step

Create a blank file inside a code-editing program and save it as a CSS file, if your website does not already have a style sheet. Open the file for every Web page in your website inside the editor. Addtags to include in your CSS file:

Step

Step

If your pages already contain similar code, then skip this step.

Step

Open the CSS file for your website and start a new line at the end of the document. Add the following code:

Step

strong {color: #ff0000;}

Step

This CSS code will change every instance of the tag to red, so all text between tags will appear red. Change the color code to the code of a color you want to use. Replace "strong" with "b" if your site uses tags to make text bold. Save the CSS file.

Step

Load your website in a browser, then check to see if the bold text is displaying in your chosen color. If some bold text is not the right color, go back to your CSS file and change it to look like this:

Step

strong {color: #ff0000 !important;}

Step

Your site may already have styles set for bold text in another part of the CSS file, or directly in the HTML tag. So-called "inline styles" applied directly to tags in the HTML file are given preference by the browser, hence the term "cascading." The "important" declaration will override all other CSS rules.