Menu images + titres
Résolu
TeeZor
Messages postés
18
Date d'inscription
Statut
Membre
Dernière intervention
-
animostab Messages postés 2829 Date d'inscription Statut Membre Dernière intervention -
animostab Messages postés 2829 Date d'inscription Statut Membre Dernière intervention -
A voir également:
- Menu images + titres
- Menu déroulant excel - Guide
- Des images - Guide
- Canon quick menu - Télécharger - Utilitaires
- Appliquez à tous les paragraphes du document à télécharger, à l’exception des titres et des sous-titres, la mise en forme suivante : - Guide
- Windows 11 menu démarrer classique - Guide
1 réponse
Salut
bon déja ne jamais utiliser la balise table pour autre chose que des données tabulaires. Pas de table pour le positionnement. Ensuite ce n'est pas un menu car il n'y a aucun lien
fait plutot ca
la on imagine que tes images font 150px X 150px si elle n'ont pas toutes la meme taille difficile de faire ce que tu demande
le html
<div id="menu">
<ul>
<li><a href="#"><img src="image1.png"><span>Nom rubrique 1</span></a></li>
<li><a href="#"><img src="image2.png"><span>Nom rubrique 2</span></a></li>
<li><a href="#"><img src="image3.png"><span>Nom rubrique 3</span></a></li>
<li><a href="#"><img src="image4.png"><span>Nom rubrique 4</span></a></li>
<li><a href="#"><img src="image5.png"><span>Nom rubrique 5</span></a></li>
</ul>
</div>
le css
#menu ul {
margin:0;
padding:0;
text-align:center;
}
#menu li {
display:inline-block;
list-style-type:none;
margin:0 30px; /***adapter pour ecartement entre les images***/
}
#menu span {
width: 150px; /***meme largeur que les images***/
position:absolute;
text-align:center;
margin:60px -150px;/***a modifier suivant taille des images***/
}
voila ca te donne un menu centré le span centré dans les images
bon déja ne jamais utiliser la balise table pour autre chose que des données tabulaires. Pas de table pour le positionnement. Ensuite ce n'est pas un menu car il n'y a aucun lien
fait plutot ca
la on imagine que tes images font 150px X 150px si elle n'ont pas toutes la meme taille difficile de faire ce que tu demande
le html
<div id="menu">
<ul>
<li><a href="#"><img src="image1.png"><span>Nom rubrique 1</span></a></li>
<li><a href="#"><img src="image2.png"><span>Nom rubrique 2</span></a></li>
<li><a href="#"><img src="image3.png"><span>Nom rubrique 3</span></a></li>
<li><a href="#"><img src="image4.png"><span>Nom rubrique 4</span></a></li>
<li><a href="#"><img src="image5.png"><span>Nom rubrique 5</span></a></li>
</ul>
</div>
le css
#menu ul {
margin:0;
padding:0;
text-align:center;
}
#menu li {
display:inline-block;
list-style-type:none;
margin:0 30px; /***adapter pour ecartement entre les images***/
}
#menu span {
width: 150px; /***meme largeur que les images***/
position:absolute;
text-align:center;
margin:60px -150px;/***a modifier suivant taille des images***/
}
voila ca te donne un menu centré le span centré dans les images
Merci beaucoup