28220 sujets

CSS et mise en forme, CSS3

Changer la couleur d'un lien

Bonjour,

Désolé pour cette question qui doit sans doute être très simple à résoudre pour vous mais je débute..

Voilà j'ai un css (ps : le css vient de cette page : http://css.alsacreations.com/modelesmenus/p1.htm) dont le code est le suivant dans mon <header>
<style type="text/css">
body {font: 14px Verdana, Arial, sans-serif;
background-color: #FFFFFF}
<!--
/* CSS issu des tutoriels css.alsacreations.com */
ul {list-style-type: none;
margin: 0;
padding: 0;}
.menu a{
display: block;
height: 20px;
width: 150px;
text-decoration: none;
color: #000;
text-indent: 20px;
background-image:url(http://localhost/avers/imageprojet1/puce0.gif);
background-position: left center;
background-repeat: no-repeat;
}
.menu a:hover{
background-image:url(http://localhost/avers/imageprojet1/puce1.gif);
background-position: left center;
background-repeat: no-repeat;
}
  </style>



et je fais appel à ca dans mon <body> pour afficher un menu dont le code est le suivant : 

<ul class="menu">
              <font face="Times"
 size="1"><li><a
 href=""><b>Menu
1</b></a></li>
              <li><a
 href=""><b>Menu
2</b></a></li>
              <li><a
 href=""><b>Menu 3</b></a></li>
              <li><a
 href=""><b>Menu 4</b></a></li>
              </font>
            </ul>

Et ce que je voudrai faire c'est pouvoir mettre Menu1;menu2 etc.. en couleur bleu Smiley lol

mais je n'y arrive pas... Smiley bawling

Voilà si vous pouvez m'apporter un peut d'aide je vous en serai très reconnaissant Smiley biggrin
Modifié par misfu (03 Jun 2005 - 11:05)
Administrateur
Bonjour à toi et bienvenue ici.

Malheureusement, je pense que tu a dû seulement survoler les Règles du forum car celles-ci t'invitent à afficher tes codes et exemples lisiblement, ce que tu n'as pas fait Smiley decu

Règle a écrit :
13- Mise en forme générale des messages
Merci de bien vouloir prendre le temps de présenter correctement vos messages, surtout si ces messages doivent inciter les autres membres à vous dépanner sur un problème. Des boutons de mise en forme sont prévus pour cela (gras, italique, etc.). Merci de systématiquement baliser vos codes HTML ou CSS avec le bouton CODE approprié (éviter également, pour des questions de lisibilité, de présenter des codes HTML et PHP imbriqués). Enfin, n'hésitez pas à toujours fournir une image explicative et une url où les membres auront un aperçu de votre problème.


J'aimerais donc que tu modifies ton premier message en conséquence.

Pour ce qui est de ta question, c'est effectivement une question de base en CSS.
Comme l'ethique de ce forum n'est pas d'apporter les réponses sur un plateau mais d'aider à la réflexion afin que tu comprennes ce que tu fais, je t'invite à débuter ton apprentissage sur cet excellent lien pour débutants :
http://www.tuteurs.ens.fr/internet/web/html/bases.html
http://www.tuteurs.ens.fr/internet/web/html/css.html

Tu y apprendras tous les termes et tout ce qu'il te faut pour résoudre ton problème... et beaucoup d'autres par la suite ! Smiley smile

Bon apprentissage Smiley cligne

PS : je te donne quand-même un indice : pour désigner un lien <a> contenu dans un élément de classe "menu", on utilise en CSS le sélecteur de hiérarchie :
.menu a {propriétés...}

C'est donc ce que tu recherches.

Ensuite, la propriété CSS qui modifie la couleur est tout simplement "color". Ici elle est en noir (code #000).
Voilà de bonnes indications Smiley cligne

Autre chose : évite de mélanger des styles HTML (ici ton <font>) avec les CSS. Ne garde que les CSS pour la mise en page : ton <font> est inutile.
Modifié par Raphael (03 Jun 2005 - 11:08)
Merci d'être aussi rapide Smiley smile

J'ai donc modifié la couleur par #blue et ca me l'affiche en violet..??
Mais ca je devrai pouvoir le résoudre seul en donnant un code différent.

Sinon pour ce qui est du <font> tu dis que c'est donc mieux que je le déclare dans le css Smiley eek

et je suppose que c'est donc à cet endroit la : 
.menu a {propriétés...}
dans propriétés que je le déclare.

Je me met tout de suite au boulo et je reste connecté sur le forum en cas de nouvelles questions Smiley smile
Administrateur
misfu a écrit :
Merci d'être aussi rapide Smiley smile

J'ai donc modifié la couleur par #blue et ca me l'affiche en violet..??

Oui car "#blue" n'est pas une valeur existante.
Le # signifie que tu annonces une valeur en héxadécimal (par exemple #000000 ou #000 en raccourci), or "blue "n'est pas de l'héxa.
Du coup, il choisit la couleur violette, qui est la couleur par défaut des liens.

Par contre, "blue" (sans #) fonctionne Smiley cligne

misfu a écrit :

Sinon pour ce qui est du <font> tu dis que c'est donc mieux que je le déclare dans le css Smiley eek

et je suppose que c'est donc à cet endroit la : 
.menu a {propriétés...}
dans propriétés que je le déclare.

.menu a {propriétés...} s'applique aux liens contenus dans .menu
.menu {propriétés...} s'applique à tous les éléments dans .menu

à toi de voir ce que tu veux modifier.

Ensuite la propriété CSS à utiliser est "font-size"
Modifié par Raphael (03 Jun 2005 - 11:22)
Encore merci Smiley smile

J'ai donc essayé et mon code donne maintenant ca : 

.menu a{
display: block;
height: 20px;
width: 150px;
font-size: "1";
font-face: "Times";
text-decoration: none;
color: #2a679b;
etc...


seulement la le font-face ne fonctionne pas ??
le font-size non plus..
par contre pour la couleur c'est nikel comme ca Smiley smile
Administrateur
misfu a écrit :

J'ai donc essayé et mon code donne maintenant ca : 

.menu a{
display: block;
height: 20px;
width: 150px;
font-size: "1";
font-face: "Times";
text-decoration: none;
color: #2a679b;
etc...


seulement la le font-face ne fonctionne pas ??
le font-size non plus..
par contre pour la couleur c'est nikel comme ca Smiley smile

Eh oui puisque "font-face" n'est pas une propriété qui existe en CSS (je suppose que tu veux utiliser font-family)

Et la valeur "1" n'est pas valable pour font-size. Il n'y a pas de guillemets dans les valeurs en CSS et il faut préciser l'unité absolument.
Par exemple :
font-size: 10px;
font-size: small;
font-size: 1em;

Etc.

Avant d'aller plus loin, je te conseille - cette fois vivement - de te plonger dans les tutoriels d'apprentissage Smiley cligne
Modifié par Raphael (03 Jun 2005 - 11:51)
Sujet clos
Aller à