Bonsoir,
je code en html un site web, et j'ai besoin de votre aide.
En haut du site, j'ai 3 boutons.

En html, j'ai donc mis :

<li><a href="index.html" title="" >Accueil</a></li>

<li><a href="ADRESSE" title="" target="_blank" > Mon twitter </a></li>

<li><a href="ADRESSE" title="" target="_blank" > Facebook </a></li>

Voila, maintenant le CSS :

1. menu ul li{

list-style:none;
float:left;
padding:0;
}

1. menu ul li a{

height:35px;
width:100px;
font-size:14px;
text-decoration:none;
text-align:center;
display:block;
float:left;
background:url(theme/Bouton1.png) no-repeat top right;
margin: 7 10 10 0px;
line-height:50px;
color:#5d5d5d;
}

1. menu ul li a:hover{

background:url(theme/Bouton.png);
color:#000;
}

Maintenant, là ou je bloque, c'est que, par exemple, sur le bouton accueil, j'aimerais mettre un autre style de bouton (sans le survoler ni rien) juste que le bouton soit different quoi...
Je voit pas comment faire, sans que ça n'affecte les 3 en même temps...
En utilisant class ? Et en CSS il faut changer quoi ?

d'avance

<li><a id="truc" href="index.html" title="" >Accueil</a></li>

puis dans le css

a #truc {
}

et voilà

Sa ne marche pas ,rien ne change...
J'essaye de bidouiller...

En HTML, j'ai ceci :
<div id="conteneur">
<div id="menu">
<ul>

<li><a id="Bouton" href="index.html" title="" >Accueil</a>
</li>
<li><a href="ADRESSE" title="" target="_blank" > Mon twitter </a></li>
<li><a href="ADRESSE" title="" target="_blank" > Facebook </a></li>
[...] etc, la fin est pas très importante, je suis sur de ne pas avoir fait de fautes.

Et en CSS j'ai mis :

1. menu{

background:url(theme/contenu1.png) no-repeat bottom center;
height:70px;
}

ul li #Bouton {
list-style:none;
float:left;
padding:0;
}

ul li a #Bouton {
height:35px;
width:100px;
font-size:14px;
text-decoration:none;
text-align:center;
display:block;
float:left;
background:url(theme/Bouton.png) no-repeat top right;
margin: 7 10 10 0px;
line-height:50px;
color:#5d5d5d;
}

1. menu ul li{

list-style:none;
float:left;
padding:0;
}

1. menu ul li a{ /* Les boutons YT, Twitter... */

height:35px;
width:100px;
font-size:14px;
text-decoration:none;
text-align:center;
display:block;
float:left;
background:url(theme/Bouton1.png) no-repeat top right;
margin: 7 10 10 0px;
line-height:50px;
color:#5d5d5d;
}

1. menu ul li a:hover{

background:url(theme/Bouton.png);
color:#000;
}

Donc je pense avoir écouter ta réponse précédente, mais cela ne répond malheureusement pas a mon problème, le bouton reste comme les autres...

Lien de la page ?

Je n'est pas encore héberger mon site, ils est actuellement sur mon disque dur... Si vous voulez, je peut faire des screen, dite moi...

http://jsfiddle.net/NtqqM/
Le plus simple c'est de mettre un id (ou une class) à tes li, pis tu les styles.
Je crois qu'il faut que tu revois ta façon de cibler le bon élément en CSS. ^^

Ah oui, je n'avait pas penser a sa.
tous marche

[-ArK-] a juste ajouté un espace en trop entre le "a" et le "#".