Problème de menu
tictactoc
-
divland Messages postés 194 Date d'inscription Statut Membre Dernière intervention -
divland Messages postés 194 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
j'essaie de créer un site et j'ai un problème que je voudrais vous exposer:
Je voulais faire un menu avec des boutons que j'ai crée et que quand on passe la souris dessus ils changent avec d'autres boutons. Pour ce faire j'ai donc crée un div pour chaque bouton te tapé le css nécessaire...mais le problème maintenant c'est que mes boutons ne veulent pas se mettre en ligne...
Pourriez vous m'aider? Merci d'avance...
j'essaie de créer un site et j'ai un problème que je voudrais vous exposer:
Je voulais faire un menu avec des boutons que j'ai crée et que quand on passe la souris dessus ils changent avec d'autres boutons. Pour ce faire j'ai donc crée un div pour chaque bouton te tapé le css nécessaire...mais le problème maintenant c'est que mes boutons ne veulent pas se mettre en ligne...
Pourriez vous m'aider? Merci d'avance...
A voir également:
- Problème de menu
- Menu déroulant excel - Guide
- Canon quick menu - Télécharger - Utilitaires
- Windows 11 menu contextuel classique - Guide
- Windows 11 menu démarrer classique - Guide
- Réinitialiser menu démarrer windows 10 - Guide
7 réponses
Oui bien sûr...(c'est un peu long désolé ;-)
body
{
background-color:rgb(22,26,27);
font-family:verdana;
}
#body2
{
background-color:rgb(13,15,16);
background-image:url("img/fond.jpg");
background-repeat:no-repeat;
background-position:center 80px;
background-attachment:scroll;
border-style:solid;
width:900px;
border-color:rgb(68,68,68);
}
#en_tete
{
background-image:url("img/bann.jpg");
width:800px;
height:106px;
background-repeat: no-repeat;
}
#news
{
width:400px;
height:200px;
background-color:rgb(84,109,142);
border-style:double;
border-width:10px;
text-align:center;
vertical-align:middle;
}
#titre_news
{
width:400px;
text-align:center;
background-color:red;
}
#accueil
{
width:78px;
height:30px;
background-image:url("img/bouton accueil.bmp");
}
#accueil:hover
{
background-image:url("img/1/accueil (1).bmp");
}
#equipe
{
width:78px;
height:30px;
background-image:url("img/équipe.bmp");
}
#equipe:hover
{
background-image:url("img/1/equipe (1).bmp");
}
#films
{
width:63px;
height:30px;
background-image:url("img/films.bmp");
}
#films:hover
{
background-image:url("img/1/films (1).bmp");
}
#forum
{
width:63px;
height:30px;
background-image:url("img/forum.bmp");
}
#forum:hover
{
background-image:url("img/1/forum (1).bmp");
}
#images
{
width:95px;
height:30px;
background-image:url("img/images.bmp");
}
#goodies
{
width:91px;
height:30px;
background-image:url("img/goodies.bmp");
}
#images:hover
{
background-image:url("img/1/images (1).bmp");
}
#goodies:hover
{
background-image:url("img/1/goodies (1).bmp");
}
#or
{
width:95px;
height:30px;
background-image:url("img/or.bmp");
}
#liens
{
width:83px;
height:30px;
background-image:url("img/liens.bmp");
}
#or:hover
{
background-image:url("img/1/or (1).bmp");
}
#liens:hover
{
background-image:url("img/1/liens (1).bmp");
}
#projets
{
width:95px;
height:30px;
background-image:url("img/projets.bmp");
}
#projets:hover
{
background-image:url("img/1/projets (1).bmp");
}
body
{
background-color:rgb(22,26,27);
font-family:verdana;
}
#body2
{
background-color:rgb(13,15,16);
background-image:url("img/fond.jpg");
background-repeat:no-repeat;
background-position:center 80px;
background-attachment:scroll;
border-style:solid;
width:900px;
border-color:rgb(68,68,68);
}
#en_tete
{
background-image:url("img/bann.jpg");
width:800px;
height:106px;
background-repeat: no-repeat;
}
#news
{
width:400px;
height:200px;
background-color:rgb(84,109,142);
border-style:double;
border-width:10px;
text-align:center;
vertical-align:middle;
}
#titre_news
{
width:400px;
text-align:center;
background-color:red;
}
#accueil
{
width:78px;
height:30px;
background-image:url("img/bouton accueil.bmp");
}
#accueil:hover
{
background-image:url("img/1/accueil (1).bmp");
}
#equipe
{
width:78px;
height:30px;
background-image:url("img/équipe.bmp");
}
#equipe:hover
{
background-image:url("img/1/equipe (1).bmp");
}
#films
{
width:63px;
height:30px;
background-image:url("img/films.bmp");
}
#films:hover
{
background-image:url("img/1/films (1).bmp");
}
#forum
{
width:63px;
height:30px;
background-image:url("img/forum.bmp");
}
#forum:hover
{
background-image:url("img/1/forum (1).bmp");
}
#images
{
width:95px;
height:30px;
background-image:url("img/images.bmp");
}
#goodies
{
width:91px;
height:30px;
background-image:url("img/goodies.bmp");
}
#images:hover
{
background-image:url("img/1/images (1).bmp");
}
#goodies:hover
{
background-image:url("img/1/goodies (1).bmp");
}
#or
{
width:95px;
height:30px;
background-image:url("img/or.bmp");
}
#liens
{
width:83px;
height:30px;
background-image:url("img/liens.bmp");
}
#or:hover
{
background-image:url("img/1/or (1).bmp");
}
#liens:hover
{
background-image:url("img/1/liens (1).bmp");
}
#projets
{
width:95px;
height:30px;
background-image:url("img/projets.bmp");
}
#projets:hover
{
background-image:url("img/1/projets (1).bmp");
}
Ce code ne marche pas et tus les boutons sur lesquels je le fais s'effacent...
Il n'y aurait pas u second plan?
Il n'y aurait pas u second plan?
bonjour,
comment ça, les boutons ne veulent pas se mettre en ligne ??
un site très intéressant pour créer un menu : http://css.maxdesign.com.au/listamatic/
https://divland.fr/
comment ça, les boutons ne veulent pas se mettre en ligne ??
un site très intéressant pour créer un menu : http://css.maxdesign.com.au/listamatic/
https://divland.fr/
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
re,
essaies plutôt comme ça :
dans le css :
a.equipe
{
background-image: url(../images/image0);
}
a.equipe:hover
{
background-image: url(../images/image1);
}
dans la page :
<a href="adresse de la page" class="equipe">equipe</a>
une remarque : bizares les adresses et noms d'images : "img/1/forum (1).bmp"
un conseil : dans un nom de fichier, il faut toujours éviter de mettre des espaces et des caractères spéciaux
https://divland.fr/
essaies plutôt comme ça :
dans le css :
a.equipe
{
background-image: url(../images/image0);
}
a.equipe:hover
{
background-image: url(../images/image1);
}
dans la page :
<a href="adresse de la page" class="equipe">equipe</a>
une remarque : bizares les adresses et noms d'images : "img/1/forum (1).bmp"
un conseil : dans un nom de fichier, il faut toujours éviter de mettre des espaces et des caractères spéciaux
https://divland.fr/
re,
ce code DOIT fonctionner, si ce n'est pas le cas, il faut voir du coté des images, leur nom avec des espaces et (), leur extension : bmp
essaies avec des images ayant un nom SANS espaces ni caractères spéciaux, mets les adresses "absolues" des images dans le css et utilises des images au format JPG ou PNG. il faut aussi mettre EXACTEMENT le nom et respecter les minuscules et majuscules.
une astuce : le plus simple pour essayer est de mettre tous les fichiers (css, page, images) dans le même répertoire, ça évite de mettre le chemin exact d'accès aux fichiers.
https://divland.fr/
ce code DOIT fonctionner, si ce n'est pas le cas, il faut voir du coté des images, leur nom avec des espaces et (), leur extension : bmp
essaies avec des images ayant un nom SANS espaces ni caractères spéciaux, mets les adresses "absolues" des images dans le css et utilises des images au format JPG ou PNG. il faut aussi mettre EXACTEMENT le nom et respecter les minuscules et majuscules.
une astuce : le plus simple pour essayer est de mettre tous les fichiers (css, page, images) dans le même répertoire, ça évite de mettre le chemin exact d'accès aux fichiers.
https://divland.fr/