How to Prevent Hyperlinks From Changing Color


It's not your imagination when a hyperlink appears to change color for no reason. Browsers can apply up to four different colors to a link in response to actions you take. Your browser has no setting that prevents hyperlinks from changing colors, but site designers can write code that keeps links the same color.

Understanding Hyperlink States

  • Link, visited, hover and active refer to the four different states in which a hyperlink can exist. When you see a hyperlink the first time, it’s in the link state. Click the hyperlink and it goes into the active state. After you click the hyperlink, your browser takes you to a new URL. If you return to the page that has the hyperlink you clicked, the hyperlink is in the visited state. It’s in that state because you clicked it to visit another Web page.

Browsers and Hyperlink Colors

  • You are probably most familiar with the hyperlink and visited states. Browsers, by default, change a hyperlink’s color to the default visited color after someone clicks the hyperlink. Many people find this behavior helpful because they can identify visited hyperlinks at a glance. Some people may also enjoy watching a hyperlink change colors when they hover over it with a mouse cursor. You must watch a hyperlink closely to see its active color after you click it. That color only appears briefly before your browser navigates to a new Web page.

Controlling Hyperlink Colors

  • Site designers can control a hyperlink's color in any state by using Cascading Stylesheets. If you understand CSS, you can use pseudo-classes to assign a color to any hyperlink state. For instance, when you want the visited color to appear green, assign it in a pseudo-class as follows: a:visited {color: green;}. Replace the word "visited" with "link," "anchor" or "hover" to assign colors to the other three hyperlink states. If you want site visitors to see the same hyperlink color regardless of what they do, give each pseudo-class the same color.

Copying Hyperlink URLs

  • You don't have to click a hyperlink in a browser tab to visit the Web page to which it points. If you right-click a hyperlink, you'll see a context menu that has an option that lets you copy the hyperlink's URL. Different browsers have different names for that option. In Firefox, click the "Copy Link Location" option. Click "Copy Shortcut" in Internet Explorer and "Copy Link Address" in Google Chrome. You can then open a new tab or browser window, click inside the address bar and press "Ctrl-V" to paste the URL of the hyperlink you copied. When you press "Enter," your browser takes you to the URL.

View Web Page Source Code

  • Many times you can right-click a blank area of a Web page and select an option that enables you to view the page's HTML source code. Select "View Page Source" if you use Firefox or Chrome. Choose "View Source" if you use Internet Explorer. After you select an option, you'll see the page's HTML code. Look through the code and find an HTML <a> tag similar to the following: "<a href="">Visit this site </a>". The string "Visit this site" is the text you see when you view the link in the browser. The text after "href=" is the hyperlink's URL. Copy that URL, open a new tab or window and paste that URL into your browser's address bar. Press "Enter" and your browser takes you to that URL.

Browsers Remember Your Visits

  • Your browser knows when you visit a hyperlink, even when you copy the link's URL and paste it into a new a new tab or window. If you return to the original page that has the hyperlink and press "F5," you'll see that its color changed to the visited color. However, you could paste the copied URL into another browser. If you do that, the color of the hyperlink in the original browser will not change.

Related Searches

  • Photo Credit IPGGutenbergUKLtd/iStock/Getty Images
Promoted By Zergnet



You May Also Like

Related Searches

Check It Out

Geek Vs Geek: Robot battles, hoverboard drag race, and more

Is DIY in your DNA? Become part of our maker community.
Submit Your Work!