|
|
|
Source : ct|02.11.08
< Tutorials Computer, Multimedia, Chinese
A link in a html page, allows to send the Internet users towards another html page, when
he clicks this link. In this tutorial, we will see how to create three types of links :
- The text links ;
- The picture links ;
- The rollover button links.
We will call respectively "essai.html" and "dest.html" the departure and destination pages. We will suppose that these pages are placed in the same directory.
The following code placed in the page "essai.html" allows to reach the page "dest.html".
<html>
<head>
<title>Essai</title>
</head>
<body>
<a href="dest.html">Cliquez ici pour aller vers dest.html</a>
</body>
</html>
Let us suppose that "image.png" is intended to serve as clickable link. Let us suppose that this image is placed in the same directory that the page "essai.html".
The following code, placed in the page "essai.html", allows to reach the page "dest.html".
<html>
<head>
<title>Essai</title>
</head>
<body>
<a href="dest.html"><img src="image.png" alt="Image"/></a>
</body>
</html>
A "rollover" button is created with two different pictures. The first picture, which we shall call "bouton1_out.png" is intended to be shown when the mouse is outside the corresponding place. The second, which we shall call "Bouton1_over.png" is intended to be shown when the mouse is exactly on the corresponding place. We shall suppose that these two pictures are placed in the same directory as the page "essai.html".
The following code, placed in the page "essai.html", allows to reach the page "dest.html" when we click the "rollover" button.
<html>
<head>
<title>Essai</title>
</head>
<body>
<!-- bouton -->
<a href="dest.html" onmouseover="document.bouton1.src='bouton1_over.png'"
onmouseout="document.bouton1.src='bouton1_out.png'">
<img src="bouton1_out.png" name="bouton1" alt=""/></a>
<br/>
</body>
</html>
 |
|
© http://turrier.fr (2007) |