Cum Adaug Efect Sau Culoare Cand Pun Mouse-Ul Pe Buton?

[Nayee2]

Am un template HTML.

Am un Buton numit "Acasa" este de culoare alb, eu vreau atunci cand mut mouse-ul pe el sa isi schimbe culoarea, cum pot face?

 

vedeti aceasta imaginea? Vedeti user-panelul? el normal este alb, dar cand mut mouse-ul pe el apare dedesubt linia portocalie.

eu vreau sa fac la mine, decat sa se sechimbe culoare sau sa se deplaseze putin in jos

[Courage]

Pai, hmm. Sa zicem ca butonul acasa are clasa asta in CSS:

.buton {
	background: #000;
	color: #fff;
	padding: 8px;
}

Ca sa schimbi stilul cand duci mouse-ul pe el, pui :hover in fata si ar veni:

.buton:hover {
	background: #fff;
	color: #000;
	padding: 8px;
}

Ca sa modifici stilul cand dai click pe acel buton, adaugi :active in fata: (ca sa se miste putin in jos, adaugi position: relative; top: 1px;)

.buton:active {
	background: #fff;
	color: #000;
	padding: 8px;
	
	position: relative;
	top: 1px;
}

[Nayee2]

Ce fac atunci cand am mai multe butoane in css?

 

ex:

#menu {
	float: center;
	width: 450px;
	margin: 0 auto;
	padding: 0;
	text-transform: uppercase;
}

#menu  ul{
	float: center;
	margin: 0;
	padding: 13px 0px 0px 0px;
	list-style: none;
	line-height: normal;
}

#menu li {
	float: left;
}

#menu a{
	display: block;
	margin-right: 1px;
	text-decoration: none;
	padding: 5px 73px 73px 11px;
	font-size: 19px;
	font-weight: bold;
	color: white;
}

[Courage]

Vezi

#menu a:hover{
	display: block;
	margin-right: 1px;
	text-decoration: none;
	padding: 5px 73px 73px 11px;
	font-size: 19px;
	font-weight: bold;
	color: white;
}