Page Title: No link underline |
View or add comments: |
Page Info
Before Reading:
Difficulty: Easy
Assumed Knowledge: Some HTML, if you dont know this, you should probably learn it before learning CSS or any other language.
No link underline:
This is a very simple thing to do, but some people don't know how to do it. So in this tutorial you will learn how. You will also learn how to make the underline come back when the mouse moves over the link.
Step 1
Before continuing on, you should probably have a website set up, or a basic web page with some links. Here is a webpage with just some links down the center:
That could should display three links in a row going downward, in the center of a page. This should be sufficent for this tutorial.
Step 2
Now comes for the no link underline. In the tags of your webpage you should now insert this code:
I'll break it up now, the
just tells the browser that you will be using CSS.
Is setting up a style for all links using the link tag:
Is saying that links should have no text decoration, IE underline. It is also ending the style for the link tag.
That just tells the browser that you are no longer using CSS.
Step 3-Optional
In this step we will make the underline come back when your mouse moves over the link.
In your
Difficulty: Easy
Assumed Knowledge: Some HTML, if you dont know this, you should probably learn it before learning CSS or any other language.
No link underline:
This is a very simple thing to do, but some people don't know how to do it. So in this tutorial you will learn how. You will also learn how to make the underline come back when the mouse moves over the link.
Step 1
Before continuing on, you should probably have a website set up, or a basic web page with some links. Here is a webpage with just some links down the center:
Code :
// hide source code
// hide line numbers
// hide source code
// hide line numbers
1
2 <html>
3 <head>
4 <title>Link Practice</title>
5 </head>
6 <body>
7 <center><a href="page.htm">Link 1</a>
8 <br />
9 <a href="page2.htm">Link 2</a>
10 <br />
11 <a href="page3.htm">Link 3</a>
12 </center>
13 </body>
14 </html>
That could should display three links in a row going downward, in the center of a page. This should be sufficent for this tutorial.
Step 2
Now comes for the no link underline. In the tags of your webpage you should now insert this code:
Code :
// hide source code
// hide line numbers
// hide source code
// hide line numbers
1
2 <style type="text/css">
3 a:link {
4 text-decoration: none;
5 }
6 </style>
I'll break it up now, the
just tells the browser that you will be using CSS.
Is setting up a style for all links using the link tag:
Is saying that links should have no text decoration, IE underline. It is also ending the style for the link tag.
That just tells the browser that you are no longer using CSS.
Step 3-Optional
In this step we will make the underline come back when your mouse moves over the link.
In your