ho messo giù due righe di codice al volo, non so quanto possa andar bene ma prova con questo

file html
codice:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<link rel="stylesheet" href="style.css" />
</head>

<body>
<ul class="test">
 
	[*]
	 PRIMA SEZIONE, Frutta
	 
		<ul id ="prima" onmouseover="this.style.display='block'" onmouseout="this.style.display='none'">
			[*]
				 PRIMA SOTTO SEZIONE, Banana
		  
			[*]
				 SECONDA SOTTO SEZIONE, Mele
		  
			[*]
				 TERZA SOTTO SEZIONE, Pere
		  
		[/list]
	
			[*]
			 SECONDA SEZIONE, Verdura
  
			[*]
			 TERZA SEZIONE, Cereali
  [/list]

</body>
</html>
file css
codice:
.test li {
    list-style:none;
	width:300px;
}
 
.test li ul {
display:none;
}
 
.test a {
 text-decoration: none;
 display:block;
}
la proprietà width di ".test li" l'ho messa altrimenti il tag avrebbe preso tutta la lunghezza della pagina, con conseguenti fastidi nella visualizzazione del menu, se vuoi toglilo.

in ogni caso io personalmente avrei utilizzato le proprità css su dei div piuttosto che sui tag[*], ma è una mia opinione. Intanto che aspetti risposte dai più esperti puoi provare con i due file che ti ho postato