How to Control HTML Hyperlink Text Colors
As you design your Web pages, you may want to change the color of your HyperText Markup Language (HTML) hyperlinks, which is the designated text that takes the viewer to another page on the Web when it is clicked. Perhaps you want to display a shade more in line with your page's color scheme or maybe you simply want to use another color to highlight your linked text. Using Cascading Style Sheets (CSS), you can control your hyperlink text colors as you require.
Other People Are Reading
Instructions
-
-
1
Open your HTML text editor and create a new page or select an existing one.
-
2
Find the "<head></head>" portion of the HTML code in your document and type in the CSS style rule code in between these two tags. The "<style type="text/css">" begins the style rule, the "<!--" and "-->" comment tags create a placeholder for the actual CSS and the "</style>" element ends the style portion of your page. For instance:
<head>
<style type="text/css">
<!--
-->
</style>
</head> -
-
3
Enter an "<a>" anchor style, which controls any hyperlinks in your page and follow this with a "color" attribute in between the comment tags. For example:
<!--
a { color: }
--> -
4
Select a color that you want your links to be by entering the color code (hexadecimal), such as "#0000FF," or by simply typing in the name of the color like "purple." You can use your text editor's "color picker" feature to get the color code or refer to an online reference (see Resources). Type in your color as follows:
a { color: #0000FF } -
5
Name your file, save it and use your editor's "Preview" function to see the new colors of your hyperlinks. From now on, all links will display this shade unless you change the CSS rule.
-
1
Tips & Warnings
If you are previewing your page in a Web browser and the CSS rule does not show up, refresh your page and then check it again.
