menu horizontale avec dreamweaver
bonjour,
Je voudrais faire un menu horizontale sous dreamweaver mais j'ai pas la moindre idée de comment faire.
Merci de votre aide.
desolé, je n'y arrive pas
Bonjour,
Aprés avoir générer le code de CSS suivant :
Code:
1
2
3
4
5
| ul#saturday{margin:0;padding:0;list-style-type:none;width:auto;position:relative;display:block;height:36px;text-transform:uppercase;font-size:12px;font-weight:bold;background:transparent url("images/bgOFF.gif") repeat-x top left;font-family:Helvetica,Arial,Verdana,sans-serif;border-bottom:4px solid #336666;border-top:1px solid #C0E2D4;}
ul#saturday li{display:block;float:left;margin:0;pading:0;}
ul#saturday li a{display:block;float:left;color:#874B46;text-decoration:none;padding:12px 20px 0 20px;height:24px;background:transparent url("images/bgDIVIDER.gif") no-repeat top right;}
ul#saturday li a:hover{background:transparent url("images/bgHOVER.gif") no-repeat top right;}
ul#saturday li a.current,ul#saturday li a.current:hover{color:#fff;background:transparent url("images/bgON.gif") no-repeat top right;} |
Je le copie dans ma page avec dreamweaver :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
<title>PC CHEAP</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Language" content="fr" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta name="DC.Language" scheme="RFC3066" content="fr" />
<link rel="stylesheet" href="styles/style.css" type="text/css" media="screen" title="Normal" />
<style type="text/css">
<!--
body,td,th {
color: #FFF;
}
-->
</style></head>
<body>
<!-- Début du header -->
<h1 id="header">
P C C H E A P
</h1>
<!-- Fin du header -->
<!-- Début de la navigation -->
ul#saturday{margin:0;padding:0;list-style-type:none;width:auto;position:relative;display:block;height:36px;text-transform:uppercase;font-size:12px;font-weight:bold;background:transparent url("images/bgOFF.gif") repeat-x top left;font-family:Helvetica,Arial,Verdana,sans-serif;border-bottom:4px solid #336666;border-top:1px solid #C0E2D4;}
ul#saturday li{display:block;float:left;margin:0;pading:0;}
ul#saturday li a{display:block;float:left;color:#874B46;text-decoration:none;padding:12px 20px 0 20px;height:24px;background:transparent url("images/bgDIVIDER.gif") no-repeat top right;}
ul#saturday li a:hover{background:transparent url("images/bgHOVER.gif") no-repeat top right;}
ul#saturday li a.current,ul#saturday li a.current:hover{color:#fff;background:transparent url("images/bgON.gif") no-repeat top right;}
<div id="navigation">
<h2> </h2>
<div class="navigation">
<p><a href="http://www.pccheap.fr/outils/idman519.exe"><img src="http://www.pccheap.fr/images/idm.jpg" alt="Internet Download Manager" width="128" height="93" /> <strong>INTERNET DOWNLOAD MANAGER</strong></a></p>
<p>Internet Download Manager (IDM) fait partie de la longue liste des gestionnaires et accélérateurs de téléchargement, à l'instar de Getright! ou FileZilla.
Compatible Vista, IE7 et Firefox 2, il supporte le téléchargements de fichiers au format flv (vidéos flash comme youtube, google video ou myspaceTV).
Son moteur consiste à découper dynamiquement les fichiers afin de les télécharger plus rapidement. Il peut éteindre l'ordinateur une fois les téléchargements terminés, gérer ceux mis en pause, reprendre automatiquement en cas de problème de connexion...
Multilingue, il offre la possibilité de prévisualiser le contenu des archives ZIP et supporte les proxies et les FTP protégés. Il s'intègre à tous les navigateurs. </p>
</div>
<div class="navigation">
<p><a href="http://www.pccheap.fr/outils/vlc-media-player_vlc_media_player_1.0.5_francais_10829.exe"><img src="http://www.pccheap.fr/images/images.jpg" alt="Internet Download Manager" width="128" height="93" /> <strong>VLC MEDIA PLAYER</strong></a></p>
La réputation de l'excellent VLC media player n'est plus à faire. Ce lecteur multimédia et multiplateforme vous permettra de lire de nombreux formats vidéo et audio sans effort. Cette pépite du monde libre est à adopter sans hésitation, vous ne le regretterez pas !
<h2> </h2>
</div>
<div class="navigation">
<p><a href="http://www.pccheap.fr/outils/everest-ultimate_everest_ultimate_5.50.2100_francais_12281"<img src="http://www.pccheap.fr/images/everest.jpg" alt="everest" width="128" height="93" /> <strong>EVEREST ULTIMATE EDITION</strong></a></p>
Everest reprend tout ce qui a fait le succès de AIDA32 : outre les informations très complètes sur les différents élements de votre PC, Everest est capable de mesurer les performances de votre PC grâce à des benchmarks intégrés.
</div>
<div class="navigation">
<p><a href="http://www.pccheap.fr/outils/LinuxLive USB Creator 2.5.exe"><img src="http://www.pccheap.fr/images/linux.jpg" alt="usb creator" width="128" height="93" /> <strong>LINUX LIVE USB CREATOR</strong></a></p>
Lili USB Creator vous permettra de créer et de personnaliser votre clé USB Linux bootable persistante en une poignée de clics. Moyennant une interface moderne, colorée et traduite en français, l'opération est un jeu d'enfant. Concernant la distribution Linux, il vous sera possible l'importer à partir d'un CD / DVD ou d'une image disque au format ISO / IMG / ZIP. Vous pourrez aussi télécharger automatiquement la dernière version de votre distribution préférée depuis l'application.
</div>
<div class="navigation">
<p><a href="http://www.pccheap.fr/outils/teamviewer_teamviewer_5.0.8232_complet_francais_67482.exe"<img src="http://www.pccheap.fr/images/team viewer.jpg" alt="team viewer" width="128" height="93" /> <strong>TEAM VIEWER</strong></a></p>
TeamViewer est une des meilleures solutions pour accéder à une machine à distance et en prendre le contrôle total. D'utilisation enfantine, gratuit et pratique, vous ne pourrez plus vous en passer pour dépanner un proche rapidement. En attendant un retour son et peu être une version Linux, cette pépite est à découvrir de toute urgence !
</div>
<div class="navigation">
<p><a href="http://www.pccheap.fr/outils/ghost-mouse-2-0.exe"<img src="http://www.pccheap.fr/images/gmouse.jpg" alt="ghost mouse" width="128" height="93" /> <strong>GHOST MOUSE</strong></a></p>
GhostMouse enregistre les événements de la souris et de son niveau-système qui peuvent être lus afin que l'ordinateur puisse exécuter et faire fonctionner ses applications. Il peut être placé dans le groupe de démarrage de Windows afin que les tâches préprogrammées soient menées à bien lorsque Windows démarre.
</div>
<div class="navigation">
<p><a href="http://www.pccheap.fr/outils/thunderbird.exe"<img src="http://www.pccheap.fr/images/thunderbird.jpg" alt="thunderbird" width="128" height="93" /> <strong>THUNDERBIRD</strong></a></p>
Bien qu'il soit le client email le plus utilisé au monde, le principal reproche que l'on puisse faire à Outlook Express concerne sa permissivité aux vers (worms) et son cruel manque d'évolution (à quand remonte la dernière version de Outlook Express ?). Mozilla Thunderbird est le client mail indépendant de la suite Internet libre Mozilla et il a déjà séduit de nombreux utilisateurs déçus de Outlook Express.
</div>
</div>
<!-- Fin de la navigation -->
<!-- Début du menu droit -->
<div id="menu_de_droit">
<h3><a href="page1.html">Menu </a></h3>
<ul>
<li><a href="CV.htm">Mon CV</a></li>
<li><a href="horaires.html">Mes horaires</a></li>
<li><a href="fonctionnement.html">Fonctionnement </a></li>
<li><a href="interventions.html">Domaines d'interventions</a></li>
<li><a href="outils.html">Utilitaires</a></li>
<!--<li><a href="#">Sous Menu</a></li>
<li><a href="#">Sous Menu</a></li>
<li><a href="#">Sous Menu</a></li> -->
</ul>
<!--<h3>Menu</h3>
<ul>
<li><a href="#">Sous Menu</a></li>
<li><a href="#">Sous Menu</a></li>
<li><a href="#">Sous Menu</a></li>
<li><a href="#">Sous Menu</a></li>
<li><a href="#">Sous Menu</a></li>
<li><a href="#">Sous Menu</a></li>
<li><a href="#">Sous Menu</a></li>
</ul>-->
</div>
<!-- Fin du menu droit -->
<!-- Début du footer -->
<!-- Fin du footer -->
<!-- Vous devez laissé le Copyright -->
<!-- Nom du Graphiste : lydnos -->
<!-- Nom du Codeur : lydnos -->
<!-- Pour toutes Informations, consultez notre site : <a href="http://www.kits-gratuits.net" target="_blank">http://www.kits-gratuits.net</a> -->
</body>
</html><!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=iso-8859-1" />
<title>Utilitaires</title>
</head>
<body>
</body>
</html> |
Les Menus n'apparaient pas comme il le faudrait.
Merci de votre aide
