Advertisement
Guest User

Exemple lien/bouton

a guest
Jul 9th, 2012
85
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 1.35 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title>Lien sur bouton</title>
  6. <style type="text/css">
  7.  
  8. /* Véritable bouton */
  9. input.link_button:hover {
  10.     color: darkblue;
  11. }
  12.  
  13. /* Lien déguisé en bouton */
  14. a.simple_link {
  15.     width: 100px;
  16.     height: 18px;
  17.     display: block;
  18.     border: 1px solid black;
  19.     font-family: Tahoma, Geneva, sans-serif;
  20.     font-size: 12px;
  21.     color: #666;
  22.     background-color: #EEE;
  23.     text-align: center;
  24.     text-decoration: none;
  25. }
  26.  
  27. a.simple_link:hover {
  28.     color: #333;
  29.     background-color: #DDD;
  30. }
  31.    
  32. </style>
  33. <script type="text/javascript">
  34. /* Javascript d'exemple, code à parfaire - Retirer toute présence de JS du code HTML et éventuellement passer par une librairie tel que jQuery */
  35. function loadUrl(url) {
  36.     document.location.href = url;
  37.     return true;
  38. }
  39. </script>
  40. </head>
  41.  
  42. <body>
  43. <p>
  44. Véritable bouton</p>
  45. <p>
  46.   <input type="button" name="button" id="button" class="link_button" value="Aller sur Google" url="http://www.google.fr" onclick="loadUrl('http://www.google.fr')" />
  47. </p>
  48. <p>&nbsp;</p>
  49. <p>Lien déguisé en bouton</p>
  50. <p>
  51.   <a href="http://www.google.fr" class="simple_link">Aller sur Google</a></p>
  52. </body>
  53. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement