How to Hide an Underline in a Hyperlink

Hyperlinks are clickable navigation tools that lead website visitors to sections of an online document or new web page. Designing web pages with underline hyperlinks is one of web typography's top ten sins, according to Smashing Magazine, because hyperlink underlines intersect a font's lowercase descenders and diminish its legibility. Assuming that you are working with HTML code to control the look of a web page and its hyperlinks, rather than trying to hide the underline, it's best to include code that will dictate how browsers should display hyperlinks.

Instructions

    • 1

      Delete conventional HTML hyperlink code and remove any incidents of HTML code that undermines the legibility of your hyperlink. Remove HTML entries such as "border-bottom: solid." If you need an underline hyperlink in the future, use the HTML command, "text-decoration: underline" instead because it draws a line beneath a font's descenders.

    • 2

      Notify browsers that support style commands within HTML text that you want the link to display without any default text decorations. Type "text-decoration: none" between the corresponding style commands, beneath the HTML's opening head. Add "<style href>a {text-decoration: none} </style>," for example.

    • 3

      Control the look of a hyperlink with a cascading style sheet. Create a style sheet to style the look of your hyperlink. Include the code, "{text-decoration:none;}" next to the style that you define for all hyperlinks within your cascading style sheet, then add the cascading style sheet's URL and its values to your HTML file, as well as the relevant syntax that your web page needs to reference the cascading style sheet, such as "<LINK href="mystyle.css" rel="stylesheet" type="text/css">."

Related Searches:

References

Comments

You May Also Like

Related Ads

Featured