• Szerző: Sallai András
• Copyright © Sallai András, 2012, 2013, 2014, 2020
• Licenc: GNU Free Documentation License 1.3
• Web: https://szit.hu

<nav>
    <ul>
	<li><a href="#">Második</a></li>
	<li><a href="#">Harmadik</a></li>
	<li><a href="#">Negyedik</a></li>
    </ul>
</nav>

style.css

nav ul {
	list-style-type: none;
}
nav ul li {
	/*display: inline;*/
	float:left;
	margin-left: 0;
}
nav ul li a {
	text-decoration: none;
	padding: 15px;
	background-color: #005500;
	color: white;
}
nav ul li a:hover {
	background-color: yellow;
	color: black;
}

<div id="menu">
<ul>
	<li class="fo"><a href="masodik.html">Második</a>
		<ul>
			<li><a href="#">Almenü</a></li>
			<li><a href="#">Almenü</a></li>
			<li><a href="#">Almenü</a></li>
			<li><a href="#">Almenü</a></li>
		</ul>
	</li>
	<li class="fo"><a href="harmadik.html">Harmadik</a></li>
	<li class="fo"><a href="negyedik.html">Negyedik</a></li>
</ul>
</div>

style.css

body {
	margin: 2% 10%;
}
 
#menu ul {
	list-style-type: none;
	margin:0;
	padding:0;
 
}
#menu ul li.fo {
	/*display: inline*/;
	float:left;
	width: 60px;
}
#menu a {
	text-decoration: none;
	padding: 0 5px;
	background-color: #005500;
	color: white;
	display:block;
}
#menu a:hover {
	background-color: yellow;
	color: black;
}
 
#menu ul ul {
	position: absolute;
	display: none;
}
 
#menu ul li:hover ul {
	display:block;
}
 
#menu ul ul li {
	display: block;
}

<nav>
    <ul>
	<li><a href="#">Második</a></li>
	<li><a href="#">Harmadik</a></li>
	<li><a href="#">Negyedik</a></li>
    </ul>
</nav>

nav ul {
	list-style-type: none;
	font-size:0;
}
nav ul li {
	display: inline-block;
}
nav ul li a {
	text-decoration: none;
	padding: 15px;
	background-color: #005500;
	color: white;
	font-size: 1rem;
}
nav ul li a:hover {
	background-color: yellow;
	color: black;
}

• http://www.dynamicdrive.com/style/csslibrary/item/css3_semi_opaque_menu/
• http://cssmenumaker.com
• http://www.netoktato.hu/?func=tut&act=view&cat=6&id=216
• http://www.tutorial.hu/menuk-css-el-szabvanyosan-es-gyorsan/