28173 sujets

CSS et mise en forme, CSS3

salut, j'ai un menu fait en css, voici tout le code css de mon site, ci-après, avec les liens. Je sais, le code est un peu chaotique et présente des erreurs, mais il marche sous tous mes browsers. Je dois aussi changer les unités px en em mais je crains un changement de ma mise en page.
Ce que je voudrais, c'est mettre en surbrillance les entrées du menu quand elles sont survolées et activées, est-ce possible avec les classiques liens:

a:link {
color: #000066;

}

a:visited {
color:#000000;
}

a:hover {
color: #867653;
   
}

a:active {
color:#000000;
}


Comme le principe des images survolées sauf que ici, j'ai des liens et pas des images,c.à.d que le fond et le choix d'un menu seront en surbrillance par rapport aux autres choix désactivés, si j'ose dire les choses ainsi.


/* CSS Document */

.font {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: normal;
	font-style: normal;
	font-variant: normal;
}

.gras {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font:
	font-weight: normal;
	font-style: normal;
	font-weight: bold;	
}

body {
	position: absolute;
	margin: 0em;
	margin-left: 0em;
	padding: 0em;
	width: 100%;
	height: 100%;
	
}

div#haut {
	margin-bottom:auto;
	margin-top:auto;
	width: auto;
	height: 0.50em;
	
	
}

div#conteneur {
	
	height: 100%;
	width: 100%;
	float:left;
	}
	  

#menu {
	position: absolute;
	width: 126px;
	height: 550px;
	margin: 0px;
	padding: opx;
	left: -15px;
	/*padding-left:inherit;*/
	margin-top: 142px;
	top: 3px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #000066;
	background-color:#FFFFFF;
	
		}
		
/*#menu ul li{

    border-top: 1px dashed #000;
    padding-bottom: 5px;
    width: 90px
} 	*/
	
	
a:link {
color: #000066;

}

a:visited {
color:#000000;
}

a:hover {
color: #867653;
   
}

a:active {
color:#000000;
}
	

#frame {
	position:relative;
	margin-top: 140px;
	margin-left: 110px; /* on place ce bloc à droite du bloc menu de 180px de large */
	margin-bottom: 0px;
	padding: 10px;
	padding-top: 5px;
	height: 70%;
	width: 910px;
	overflow: auto;  /*cette propriété va permettre le scroll de ce bloc */
	font-size: 11px;
	font-family: Arial, Helvetica, sans-serif;
	border-left:dotted thin;
	
	}

#bas {
	position:relative;
	margin:0px;
	margin-top: auto;
	width: 860px;
	height: 50px;
        top: 0px;
	
}

</style>

Merci de me conseiller
Modifié par midiweb (06 Feb 2007 - 18:32)
Salut,

Quelle est ta question ou ton problème, car en l'absence d'une page en ligne référente, je ne comprends pas ce que tu cherche à faire ?
Merci de ta réponse. Je n'ai encore rien en ligne. Je veux dire plus précisément, comment fait-on avec des css pour mettre un choix en surbrillance, comme une image survolée qui change lorsqu'on passe dessus avec la souris. Voici un exemple sur le site suivant:
http://www.meilleursjeux.net/

Passe sur les menus à gauche avec ta souris. Peut-être me faudra-t-il du Javascript avec le CSS. je ne sais pas encore.

A+
Modifié par midiweb (06 Feb 2007 - 18:59)
Salut,

L'exemple sur le lien que tu m'as donné ne nécessite rien de plus que les CSS.

Il te faut pour cela utiliser les différents états possible sur la balise <a>
Pour plus d'informations, je t'invite à consulter cette page notamment la partie "Cas de la balise de lien <a>"