CODEWITHSUNDEEP
htmlcss
user519753
user519753

Reputation: 1587

Problem with <a> tags in HTML + CSS styling

When you use the <a> tag it defaults your linked text with an underline, so naturally I thought you used font-style:normal; but it doesn't seem to be working for me anymore, maybe it's my version of Firefox or Firebug???

Here's my current source code, the simplest test case:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>test dummy</title>
  </head>
  <body>    
    <a style="font-style:normal;" href="login_page/login.html">Login</a>
  </body>
</html>

Unfortunately this code does not work either, Login appears underlined.

EDIT: The original author meant underline but wrote italics

Upvotes: 0

Views: 7572

Answers (4)

user2556381
user2556381

Reputation:

Set the text-decoration property to none, like this :

text-decoration: none;

Upvotes: 0

Christopher
Christopher

Reputation: 267

Using CSS so you can decrease the amount of code being pushed through the browser, I would use the following code:

<body> 
<a href="somewhere.html">Somewhere</a> 
<a href="someotherplace.html">Some other place</a> 
</body>

Inside your css:

a{ 
text-decoration: none; 
} 
a:hover{ /* For when your mouse hovers over the element */ 
text-decoration: underline; 
} 
a:visited{ /* For links that are in the browser history (Previously visited) */ text-decoration: none; 
color: purple; 
} 
a:active{ /* For links that you are clicking on */ 
text-decoration: none; 
color: blue; 
}

Now, every a tag in your document will have the same properties.

Upvotes: 0

jcolebrand
jcolebrand

Reputation: 16025

What you want is text-decoration:none; in your stylesheet

Upvotes: 0

sevenseacat
sevenseacat

Reputation: 25029

If you mean underline, then the correct way to take the underline off would be:

<a style="text-decoration: none;" href="login_page/login.html">Login</a>

Upvotes: 5

Related Questions