Techzine » Tutorials » Coding »

27

reacties

Menu in CSS

Door Phontius op Woensdag 29 september 2004 18:13, 54336x bekeken

Het menu

Een menu met submenu's. Dat willen vele mensen wel op hun site hebben, maar om een goed werkende te hebben, daar zijn uit eigen ervaring heel wat mensen naar op zoek. In deze tutorial leer ik je hoe je een menu, in juist CSS, kan laten werken, bovendien ook in Internet Explorer.

Je hebt drie files nodig. 'index.html', 'style.css' en 'menu.js'.
We beginnen in index.html:

PHP Code
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<ul id="nav"> 
	<li><a href="#">Menu 1</a> 
		<ul>
			<li><a href="#">Submenu 1</a></li> 
			<li><a href="#">Submenu 2</a></li> 
			<li><a href="#">Submenu 3</a></li> 
		</ul> 
	</li> 
	<li><a href="#">Menu 2</a> 
		<ul>
			<li><a href="#">Submenu 4</a></li> 
			<li><a href="#">Submenu 5</a></li> 
			<li><a href="#">Submenu 6</a></li>
			<li><a href="#">Submenu 7</a></li> 
			<li><a href="#">Submenu 8</a></li> 
		 </ul> 
	 </li> 
	 <li><a href="#">Menu 3</a></li> 
	 <li><a href="#">Menu 4</a> 
	 	<ul> 
	 		<li><a href="#">Submenu 9</a></li> 
		</ul>
	 </li> 
 </ul>


In de eerste, tweede en vierde zie je submenu's, in de derde zie je dat er geen submenu's te zien zijn. Dit kan dus ook gewoon.

Volgende pagina: De style - 2/3

Meest recente nieuws