HTML структура
HTML верх
Код:
<div id="container"> <ul id="nav"> <li><a href="ссылка">Home</a></li> <li><a href="ссылка">About</a></li> <li><a href="ссылка">Work</a></li> <li><a href="ссылка">Contact</a></li> </ul> </div>
HTML низ
Код:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js" type="text/javascript"></script> <script src="http://forumstatic.ru/files/000f/33/e7/54255.js" type="text/javascript"></script> <script src="http://forumstatic.ru/files/000f/33/e7/88789.js" type="text/javascript"></script>
CSS
Это можно добавить в Свой стиль
Код:
ul#nav { width: 700px; margin: 0 auto; text-align: center; overflow: hidden; } ul#nav li { float: left; list-style: none; } ul#nav li a { display: block; width: 97px; height: 77px; padding: 72px 0 0 0; margin: 0 32px 0 32px; font: bold 16px Helvetica, Arial, Sans-Serif; text-transform: uppercase; color: #9c5959; text-shadow: 0 1px 3px #c4bda6; text-decoration: none; background: url(http://forumstatic.ru/files/000f/33/e7/60551.png) 0 -149px no-repeat; } ul#nav li a:hover { background: url(http://forumstatic.ru/files/000f/33/e7/60551.png) 0 0 no-repeat; color: #eee9d9; text-shadow: 0 2px 3px #4c2222; } ul#nav li a.js:hover { background: url(http://forumstatic.ru/files/000f/33/e7/60551.png) 0 -149px no-repeat; }