I want to create a css menu like the attached screen shot, please could anyone help me.

http://tinypic.com/r/2hmdk7q/4

2 answers

0
points

Hm... if you are new to CSS i would advice you to look at some tutorials, this one is pretty nice to begin with :)

Now, the Design of that list should be pretty simple. If you have some kinda standard markup like this:

<ul>
  <li><img /><a>Text</a></li>
  <li><img /><a>Text2</a></li>
  ...
</ul>

Then you can add the Background to the ul tag, remove the bullets from the list and style the font with the following lines:

ul{
  background-image:url(path);
  background-repeat:no-repeat; // Depends on your image, remove to tile the img
}
li{
  list-style:none;
  font-color:#334455;
  font-decoration:none;
  .... // Just add your font styles here
}

The image should be placed next to the text of the link, so this should be enough at first. Of course you have to modify some things, thats why you have to know some basics of CSS. But i guess this can be usefull for you.

Answered about 7 years ago by Sven Finke
0
points

You could try looking at Listamatic:

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

All kinds of menus made from CSS/HTML, a lot of them designed from the best of the best.

Answered about 7 years ago by tahdhaze09