rss
Rechercher : dans
Par : Pertinence Date Nom d'utilisateur
Statut : Non résolu

Bouton--onglets css-html

Posté par jjaco, le dimanche 20 janvier 2008 à 15:28:12
Bonjour,
je viens de creer avec photofiltre des boutons (jolis)

1ère question si je met le texte, il s'affiche en haut du bouton, si je fais <br>, il se met en bas.
il faudrait un 1/2<br> pour qu'il reste au centre, mais je ne sais pas comment faire...

2ème question, j'aimerais que le lien se fasse avec le bouton et pas avec le texte.ou dois-je placer <a href>?

div#menu1{
float:left;
width:150px;
height:60px;
background-image:url(bouton.jpg);
background-repeat:no-repeat;
}

<div id="menu">
<div id="menu1"><h3><font color=white><font face ="comic sans ms">menu</font></h></div>
Configura­tion: Windows XP
Internet Explorer 7.0
Répondre à jjaco  Signaler ce message aux modérateurs Aller au dernier message

1


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
dudu134, le dimanche 20 janvier 2008 à 15:35:59
Bonjour,
< a href=" "> menu< /a>

En espérant que je vous ai aidé
Répondre à dudu134

2


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
jjaco, le dimanche 20 janvier 2008 à 15:47:47
ok merci
ça je savais, le problème est de faire le lien avec le bouton et non avec le texte puisque le bouton est en css et le texte en html
Répondre à jjaco

3


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
Gihef, le dimanche 20 janvier 2008 à 20:14:04
Bonjour,

Quand on utilise des CSS, on évite
<font color=white><font face ="comic sans ms">menu</font>
et d'utiliser des balises sémantiques (mal refermée “</h3>”) pour de la mise en forme
<h3>…</h>
<hn> c'est pour les titres, pas pour autre chose.

Il serait plus simple d'avoir
div#menu1 { 
  float:left; 
  width:150px; 
  height:60px; 
  background-image:url(bouton.jpg); 
  background-repeat:no-repeat; 
  font-family:"comic sans ms";
  color : #fff;
  font-size : --em;  /* une taille qui te plaît */
  } 
et donc
<div id="menu1">menu</div>
Plus clair, non ?
Tu vas placer chaque élément du menu dans une <div> avec une id différente ?


Pour tes problèmes, tu peux t'y prendre autrement.
NOTE : Ton code est incomplet, alors ça risque de ne pas s'adater à ton contexte.

L'alignement vertical dans tes blocs peut s'obtenir en définissant une “line-height” de la même taille que la “height”.

Le lien ne peut se faire qu'avec un <a>. Texte ou image.
Alors, la solution est de placer l'image en background du <a> pas de la <div>.
Encore faut-il qu'il y ait un <a>…
Et de définir un “display : block;” et des dimensions correspondantes au <a>.


++
Merci de penser à utiliser le bouton indiqué.

Tu trouveras un exemple ici fait avec une liste <ul> plutôt que dans une <div>. Ça peut se faire de la même façon.
Comme tu n'évoques pas d'effet au survol par la souris, tu peux te passer de ce qui concerne le “:hover” et le “:active”.


--
Répondre à Gihef

4


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
 jjaco, le dimanche 20 janvier 2008 à 22:23:23
merci, mais j'ai pas compris grand-chose...
la nuit porte conseil et demain j'étudie <ul> <li> <a> etc...
merci, je reviendrai
Répondre à jjaco
Discussions pertinentes trouvées dans le forum
12/06 11h23Menu onglets css2
03/05 01h42[css & html] Problème12
26/02 18h01Bouton rollover CSS25
07/02 22h26MON SITE ME REND FOU!! CSS HTML5
Plus de discussions sur « bouton onglets css html »
Logiciels pertinents trouvés dans les téléchargements
Télécharger HTML Tidy 0.008HTML Tidy - HTML Tidy est un utilitaire permettant de vérifier et d'optimiser tout code HTML. La version originale de cet utilitaire...Catégorie: Webmaster
Licence: Freeware/gratuit
Télécharger HTMLDOC 1.8.24HTMLDOC - HTMLDOC est un outil permettant de convertir une page HTML (Hyper-Text Markup Language) vers un fichier HTML indexé, vers...Catégorie: PDF
Licence: Freeware/gratuit
Télécharger Web Developer Toolbar 1.1.6Web Developer Toolbar - WebDeveloper est une extension firefox représentant une formidable boîte à outils pour examiner et manipuler les pages...Catégorie: Extensions Firefox
Licence: Freeware/gratuit
Télécharger Amaya 9.54Amaya - Amaya est un éditeur Web, développé conjointement par l'INRIA et le W3C, pour éditer et publier très simplement des pages...Catégorie: Editeurs HTML
Licence: Open Source
Plus de logiciels gratuits sur « bouton onglets css html »