5568 sujets

Sémantique web et HTML

Bonjour à tous,

Pouvez-vous m’aider j’ai un souci ?
Je suis entrain de créer un site web avec HTML CSS
Mon problème est que, j’ai crée un menu, quand on y passe la souris l’onglet sélectionné change de couleur. exemple: si je sélectionne dans le menu l’onglet “contact”, la couleur change mais ne se fixe pas.
Je voudrais que tant que le visiteur reste sur la page sélectionnée la couleur de l’onglet reste fixée. L’idée étant qu’il n’oublie pas sur quelle page il se trouve.

Qui peut me dire le code à utiliser pour mettre cela en place ?

Merci d’avance
Merci mais Je ne dois pas être douée lol, car cela fonctionne pas.
Peut être en voyant mon code, vous me dirais ce que je dois rajouter pour que cela fonctionne ?
Voici mon code HTML

<li>
                            <h4><a href="particuliers.html">PARTICULIER</a></h4>
                            <ul>
                                 <li><a href="mariage.html"><font color="000000">Mariage</font></a></li><br>

                                <li><a href="femme_enceinte.html"><font color="000000">Femme enciente</font></a
</li><br>

                                <li><a href="naissance_bapteme.html"><font color="000000">Naissance, Baptéme</font></a></li><br>

                                <li><a href="anniversaire_communion.html"><font color="000000">Anniversaire, Communion</font></a></li>
                               
                            </ul>
                        </li>


Et voici mon code CSS

h4 a:hover,h4 a:active{
    color:#ffffff;
    text-decoration:none;
    background:#54B6A8;
    padding-left:20px;
    width:130px;
    transition:all .5s;
    font-family;'Abel', arial, serif; 
    -webkit-border-radius:17px;
}

h4 a {
    /*border:1px solid #009000;*/
    padding:3px; 
    font-size:17px;
    padding:4px;
    display:block;
    color:#ffffff;
    line-height:20px;
    
}
Déjà, enlève-tes <font>.
Ensuite, le lien de Raphaël indique tout ce dont t'as besoin.
Il faut que tu rajoutes une class "en-cours" à l'élément que tu veux mettre en évidence.

<ul>
     <li ><a href="page1.html"> titre page 1</a></li>
     <li ><a href="page2.html"> titre page 2</a></li>
     <li class="en-cours" ><a href="page3.html"> titre page 3</a></li>
     <li ><a href="page4.html"> titre page 4</a></li>
</ul>


li a {color:#000;}
li a:hover {color:green;}
li.en-cours a {color:red;}