1 svar · 249 visningar · startad av mr.mainline
Hur skriver jag om det så alla länkar får samma rollover funktion?
h1 {font: 100% Verdana; color: #333333; margin: 0;}
body {padding: 0; margin: 0;}
#content{margin: 1em; padding: 0; float: left; width: 100%;}
#menycontainer ul{margin: 0; padding: 0; float: left; width: 100%; background: #FF0000; font: 70% Verdana, Helvetica, sans-serif;}
#menycontainer li{display: inline;}
#menycontainer ul a{float: left; text-decoration: none; padding: 0.3em 1em; border: 1px solid #FF0000;}
#menycontainer a:link{color: #FFFFFF;}
#menycontainer a:visited{color: #FFFFFF;}
#menycontainer a:hover{color: #333333;}
#menycontainer a#current{background: #FF0000; color: #FFFFFF;}
<div id="menycontainer">
<ul>
<li id="active"><a href="index.htm" id="current">sida 1</a></li>
<li><a href="länk 1">sida 2</a></li>
<li><a href="länk 2">sida 3</a></li>
</ul>
</div>
Att visa en "död" länk är ju för att visa att det är där man är och lite onödigt att trycka på ... men
#menycontainer a:active{color: #FFFFFF;}
.current{background: #FF0000; color: #FFFFFF;}
och i koden:
<li id="active"><a href="index.htm" class="current">sida 1</a></li> (class istället för id)
Ha en skön helg