Removing the underline from hyperlinks in HTML

You can not remove the underline from hyperlinks with HTML tags. For this purpose, cascading style sheets are used (CSS).
One of the most common usage of CSS is removing the underline from hyperlinks. But this might be a bad idea because the user has no way to know that the text, is a hyperlink. Everyone is already used to the fact that if the text is underlined, it's a hyperlink. But if used properly, removing the underline from hyperlinks can make the site look more imposing. For example, by hovering over a hyperlink with the cursor the underline is displayed, or the color of the text changes, or both.
The underline can be hidden with style parameter text-decoration: none
, by adding it to the selector "a", as shown in example 1.
Example 1. Removing the underline from hyperlinks.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <style type="text/css"> a { text-decoration: none; /* Removing the underline from hyperlinks */ } a:hover { text-decoration: underline; /* Adding the underline when hovering over the hyperlink with the cursor */ color: red; /* Red color of hyperlink */ } </style> </head> <body> <a href="#">Point cursor here and watch what happens</a> </body> </html>
The hypertext below is the result of the example. If you hover over the hyperlink, it turns red and underlined.
Point cursor here and watch what happens: