Siri: CSS Overhead?

Beitrag lesen

SELF-Forum

CSS Overhead?

Siri
– Informationen zu den Bewertungsregeln

Hallo,

unten stehender Code stellt eine kleine Menuleiste dar. Beim überfahren des inaktiven Tabs(nav1unselected) soll der Tab bestimmte Farben annehmen (nicht zwangslügig nav1selected!). Jetzt kommt mir das aber ein bisschen viel CSS für so einen kleinen Effekt vor... Gibt es Optimierungspotential?

Viele Grüße
Siri

<?xml version="1.0" encoding="UTF-8"?>  
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml">  
	<head>  
		<meta charset="utf-8"/>  
		<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>  
		<title></title>  
		<style type="text/css">

BODY  {  
	position: absolute;  
	top: 0px;  
	left: 0px;  
	width: 100%;  
	background-color: #FFFFFF;  
	margin: 0;  
	padding: 0;	  
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;	  
	font-weight: normal;	  
}		  
ul  {  
	position: absolute;  
	top: 0;  
	left: 30px;  
	list-style: none;  
	margin: 0;  
	padding: 0;		  
	height: 26px;  
	line-height: 26px;  
	  
}  
li.nav1selected {  
	display: inline;  
	float: left; 	  
	padding-left: 20px;	  
	padding-top: 0px;	  
	padding-right: 20px;	  
	padding-bottom: 0px;	  
	margin: 0;		  
	white-space: nowrap;	  
	background-color: #393949;  
	vertical-align: middle;  
	font-size: 11px;  
	font-weight: bold;  
}  
li.nav1selected a:link, a:hover, a:active, a:visited {  
	text-decoration: none;  
	height: 26px;  
	color: #B2B1DF;  
}  
li.nav1unselected {  
	display: inline;  
	float: left; 	  
	padding-left: 20px;	  
	padding-top: 0px;	  
	padding-right: 20px;	  
	padding-bottom: 0px;	  
	margin: 0;		  
	white-space: nowrap;	  
	vertical-align: middle;  
	font-size: 11px;  
	font-weight: bold;	  
	background-color: #B2B1DF;	  
}  
li.nav1unselected a:link, a:active, a:visited {  
	text-decoration: none;  
	height: 26px;  
	color: #393949;	  
}  
li.nav1unselected a:hover {  
	text-decoration: none;  
	color: #B2B1DF;	  
	background-color: #393949;  
}  
li.nav1unselected:hover a:link, a:active, a:visited {  
	text-decoration: none;  
	color: #B2B1DF;	  
}  
li.nav1unselected:hover {  
	text-decoration: none;  
	color: #B2B1DF;	  
	background-color: #393949;  
}  


	</style>  
	</head>  
	<body>  
		<ul>  
			<li class="nav1selected" titype="standard" name="treeitem">  
				<a href="index.html">Start</a>  
			</li>  
			<li class="nav1unselected" titype="standard" name="treeitem">  
				<a href="newscalendar.htmml">Kalender</a>  
			</li>  
		</ul>  
	</body>  
</html>
Beitrag melden
–
Informationen zu den Bewertungsregeln