Question:

How do I make a horizontal menu usingCSS and lists?

by | earlier

0 LIKES Like UnLike

About HTML ?

Tags:

Report

Answer The Question I've Same Question Too

Follow Question

4 ANSWERS

Sort By: Date | Rating

you need html document and css document

*****HTML******

<html>

<head>

<title>example</title>

<link rel="stylesheet" type="text/css" href="stile.css">

</head>

<body>

<div id="menu">

<ul>

<li><a href="#"> first</a></li>

<li><a href="#"> second</a></li>

<li><a href="#"> third</a></li>

</ul>

</div>

</body>

</html>

*****CSS*****

#menu ul { ...parameters... }

#menu li {...}

#menu li a {...}

#menu li a:hover {...}
Report (0) (0) | earlier
The HTML code

<ul>

<li><a href="#">Home </a></li>

<li><a href="#">Products </a></li>

<li><a href="#">Gallery</a></li>

<li><a href="#">Clients </a></li>

<li><a href="#">About Us </a></li>

<li><a href="#">Feedback</a></li>

</ul>

The CSS code

<style>

ul {

list-style-type: none;

}

li {

display:inline;

float:left;

width:75px;

background-color:#FF99CC;

margin-right: 2px;

height:25px;

text-align:center;

padding-top:5px;

font-family:Verdana, Arial, Helvetica, sans-serif;

font-size:14px;

color:#FF00FF;

}

li a{

text-decoration:none;

}

li a:hover {

border-bottom:3px solid #000000;

}

</style>

for more tutorials log on to http://gateway2internet.com
Report (0) (0) |   earlier
Why bother when Stu on CSSPlay has dozens and dozens of great menus using CSS or CSS/JavaScript:

http://www.cssplay.co.uk/menus/

You'll find one that's better than anything anyone is going to give you here. All menus are customizable.

Ron
Report (0) (0) | earlier
The following site has many tutorials, examples and source code which are CSS based and well worth the trip.

http://css.maxdesign.com.au/listamatic/

Report (0) (0) | earlier