Links without underlining

By means of HTML tags to remove the underscore from the reference is not possible. Therefore, cascading style sheets (Cascading Style Sheets, CSS) are used for this purpose.

One of the most popular uses for CSS references - taking away from them the underscore. From the standpoint of usability is not quite the right decision, because the user can not immediately guess that the text, which he sees is a link. All in fact already used to - again underlining is used, then it is a link. But when used correctly in the absence of an underscore links can give a certain effect site. is often done, that when you move the cursor, the link becomes accentuated, changes color, or use both effects at the same time.

The emphasis is hidden by a stylistic parametroa text-decoration: none, adding it to the selector A, as shown in Example 1.

Example 1. retracting underscores in references

valid HTML
valid CSS
<DOCTYPE HTML PUBLIC! "- // W3C // DTD HTML 4.01 // EN" "http://www.w3.org/TR/html4/strict.dtd">
<Html>
<Head>
<Meta http-equiv = "Content-Type" content = "text / html; charset = windows-1251">
<Title> The emphasis in the links </ title>
<Style type = "text / css">
A {
text-decoration: none; / * Removes references to underline * /
}
A: hover {
text-decoration: underline; / * Add the underscore when you hover over the link * /
color: red; / * Link red * /
}
</ Style>
</ Head>
<Body>
<P> <a href="link.html"> Move your cursor here, you will see the result </a> </ p>
</ Body>
</ Html>

Below is the result of this example. When you hover over a link, it becomes red and underlined.

HERE hover the cursor, see results

© Policy Copyright www.htmlbook.ru