Page 1 sur 1
Menus dynamiques
Publié : 12 juil. 2006, 21:47
par gigab
Bonjour, il y a quelques jours un intervenant de ce forum donnait ce lien
http://fabiwan.kenobi.free.fr/css/NestedLists.html# au sujet de menus.
J'aimerai avoir le menu Garbiak en menu horizontal. Comment puis-je faire?
Merci d'avance de vos réponses
Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.4) Gecko/20060508 Firefox/1.5.0.4
Publié : 13 juil. 2006, 09:12
par gigab
Bon, visiblement ça n'inspire pas grand monde
Je vais la refaire plus simplifiée..
Voilà, je voudrai faire un menu qui se répète sur toutes les pages du site. Il y a le tutoriel en haut donc je vais tâcher de me débrouiller.
Ma question c'est que j'ai un code html et un code Css à mettre.
Code : Tout sélectionner
<div id="navcontainer">
<ul id="navlist">
<li><a href="" title="">Accueil</a></li>
<li><a href="" title="">Compositeurs</a></li>
<li><a href="" title="">Contact</a></li>
<li><a href="" title="">Liens</a></li>
</ul>
</div>
Code : Tout sélectionner
#navlist
{
margin: 0;
padding: 0 0 20px 10px;
border-bottom: 1px solid #000;
}
#navlist ul, #navlist li
{
margin: 0;
padding: 0;
display: inline;
list-style-type: none;
}
#navlist a:link, #navlist a:visited
{
float: left;
line-height: 14px;
font-weight: bold;
margin: 0 10px 4px 10px;
text-decoration: none;
color: #999;
}
#navlist a:link#current, #navlist a:visited#current, #navlist a:hover
{
border-bottom: 4px solid #000;
padding-bottom: 2px;
background: transparent;
color: #000;
}
#navlist a:hover { color: #000; }
Si je suis bon, le code html se place après le <br/> dans l'onglet source de Nvu, qui est après title, head et body ?
Mais pour le code Css, je ne sais pas du tout où il se place ;'(
Dans les tutoriels que j'ai vu, ils donnent le code sans dire où l'insérer...
Un grand merci pour votre aide !!!
Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.4) Gecko/20060508 Firefox/1.5.0.4
Publié : 13 juil. 2006, 09:28
par Do-IT
Tu as un fichier qui contient ton code menu (ci-dessus).
Tu as un fichier qui contient tes styles css (ci-dessus).
Ton hébergeur doit accepter le php. Le fichier ci-dessous doit avoir une extension .php
Code : Tout sélectionner
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta content="text/html; charset=UTF-8" http-equiv="content-type">
<title>Titre de la page</title>
<link rel="stylesheet" href="messtyles.css" type="text/css">
</head>
<body>
<br>
<div>
<?php include('monmenu.inc.php'); ?>
</div>
</body>
</html>
Pour le doctype et le charset et les noms de fichier tu adaptes à tes goûts.
Publié : 13 juil. 2006, 10:17
par gigab
Bon alors, si je comprend bien, dans l'affaire j'ai deux pages :
Une qui contient toutes les données du site (genre accueil, liens, contact, etc)
et l'autre *unique* qui sera dupliquée automatiquement et qui s'appelle menu.inc.php
Si c'est cela, où met-je le code html, et où met-je le code Css ?
Parce que là, je vois pas du tout
(à part recopier chaque ligne du code Css dans l'éditeur de code Css)
Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.4) Gecko/20060508 Firefox/1.5.0.4
Publié : 13 juil. 2006, 10:33
par Do-IT
J'ai pas expliqué en chinois pourtant.
Tu as 3 fichiers.
1er fichier monmenu.inc.php
Code : Tout sélectionner
<div id="navcontainer">
<ul id="navlist">
<li><a href="" title="">Accueil</a></li>
<li><a href="" title="">Compositeurs</a></li>
<li><a href="" title="">Contact</a></li>
<li><a href="" title="">Liens</a></li>
</ul>
</div>
2eme fichier messtyles.css
Code : Tout sélectionner
#navlist
{
margin: 0;
padding: 0 0 20px 10px;
border-bottom: 1px solid #000;
}
#navlist ul, #navlist li
{
margin: 0;
padding: 0;
display: inline;
list-style-type: none;
}
#navlist a:link, #navlist a:visited
{
float: left;
line-height: 14px;
font-weight: bold;
margin: 0 10px 4px 10px;
text-decoration: none;
color: #999;
}
#navlist a:link#current, #navlist a:visited#current, #navlist a:hover
{
border-bottom: 4px solid #000;
padding-bottom: 2px;
background: transparent;
color: #000;
}
#navlist a:hover { color: #000; }
3eme fichier mapage.php
Code : Tout sélectionner
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta content="text/html; charset=UTF-8" http-equiv="content-type">
<title>Titre de la page</title>
<link rel="stylesheet" href="messtyles.css" type="text/css">
</head>
<body>
<br>
<div>
<?php include('monmenu.inc.php'); ?>
</div>
</body>
</html>
Le 1er fichier tu le fais avec un éditeur de texte externe, pas avec nvu !
Pour éditer le 2eme et 3eme fichier tu peux utiliser Nvu ou Kompozer.
Publié : 13 juil. 2006, 10:57
par gigab
ça fonctionne à peu près..bon faut tout faire en php alors ?
Sinon pour modifier le Css, il faut que j'en écrive un à côté et puis après que je fasse un copier coller ?
Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.4) Gecko/20060508 Firefox/1.5.0.4
Publié : 13 juil. 2006, 13:38
par Mongo Bob
Pour modifier le css, tu utilises l'éditeur css de NVU qui ira reporter tes modifs dans le fichier lié "messtyles.css", pas de copier-coller, mais d'où vient-il le css? Tu l'as bien créé dans l'éditeur css de NVU, au départ? Ou viendrait-il de DW, puisque suite à ton autre post, je vois que tu as créé une partie de ton site avec DW, si c'est chez lui que tu as créé ton "messtyles.css", je comprends ta question, entre DW et NVU, il y a 2 façons parfaitement différentes d'aborder la création/modification css.
Alors : tout en haut, Outils/Editeur css.
Publié : 13 juil. 2006, 14:27
par gigab
Non en fait, je voudrai créer le même menu que ce site là
http://fabiwan.kenobi.free.fr/css/NestedLists.html# Menus horizontaux _>Garbiak
J'ai trouvé le style css et l'ai copié dans une page messtyles.css
Pareil pour le html, ce n'est pas moi qui ai créé le code
Enfin j'essaye de comprendre en même temps..
Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.4) Gecko/20060508 Firefox/1.5.0.4