Меню

<style type="text/css">
body {
background: #474747 url(b_21.jpg);
margin: 70px;
}

h1 a {
display: block; text-decoration: none;
font: 68px Helvetica, Arial, Sans-Serif; letter-spacing: -4px;
text-align: center;
color: #999; text-shadow: 0px 3px 8px #2a2a2a;
 }
  h1 a:hover {
  color: #BDB2B2; text-shadow: 0px 5px 8px #2a2a2a;
  }

h2 {
font: 32px Tahoma, Helvetica, Arial, Sans-Serif;
text-align: center;

color: #222; text-shadow: 0px 3px 8px #2a2a2a;
}

h3 a {
display: block; text-decoration: none;
font: 18px Helvetica, Arial, Sans-Serif; letter-spacing: 1px;
text-align: center;
color: #999; text-shadow: 1px 1px 2px #2a2a2a;
 }
  h3 a:hover {
  color: #BDB2B2; text-shadow: 1px 1px 3px #0D0C0C;
  }

pre {
width: 500px; margin: 0 auto; background: #222; padding: 20px;
font-size: 18px; color: #555; text-shadow: 0px 2px 3px #171717;
box-shadow: 0px 2px 3px #555;
-webkit-box-shadow: 0px 2px 3px #555;
-moz-box-shadow: 0px 2px 3px #555;
        border-radius: 10px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;

}
</style>
<style type="text/css">
body {
        font: 10px normal Verdana, Arial, Helvetica, sans-serif;
margin: 0;
padding: 0;
}
        .container {width: 970px; margin: 0 auto;}
               
        #nav {margin: 0; padding: 0;
float: left;
width: 970px;
list-style: none;
position: relative;
font-size: 1.2em; background: url(bkg.png) repeat-x;}
        #nav > li { list-style-type:none; float:left; display:block; margin:0px 10px;
                    position:relative; padding:10px; width:100px;}
        #nav > li:hover ul { display:block; }
        #nav > li:hover { background-color:#AAA4A4;
        border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px;
        box-shadow: 2px 3px 3px #352929;
        -webkit-box-shadow: 2px 3px 3px #352929;
        -moz-box-shadow: 2px 3px 3px #352929; }
     
        #nav li ul { margin:0px; padding:0px; display:none;}
        #nav li ul li { list-style-type:none; margin:10px 0 0 0;}
        #nav li ul li a { display:block; padding:5px 10px; color:#83FA03; text-decoration:none;}
        #nav li ul li:hover a { background-color:#606060; border-radius:5px;
        -moz-border-radius:5px;
        -webkit-border-radius:5px;
        box-shadow: 1px 2px 2px #352929;
        -webkit-box-shadow: 1px 2px 2px #352929;
        -moz-box-shadow: 1px 2px 2px #352929; }
        #nav li span { cursor:pointer; margin:0px 10px; font-weight:bold;color: #263348;}
   </style>

<div style="clear: both; display: block; padding-bottom: 20px; text-align: center;">

        <ul id="nav">
            <li><span>Головна</span>
                <ul>
                    <li><a href="#">Пункт меню 1</a></li>
                    <li><a href="#">Пункт меню 2</a></li>
                    <li><a href="#">Пункт меню 3</a></li>
               </ul>
            </li>
            <li><span>Про блог</span>
                <ul>
                    <li><a href="#">Пункт меню 1</a></li>
                    <li><a href="#">Пункт меню 2</a></li>
                    <li><a href="#">Пункт меню 3</a></li>
               </ul>
            </li>          
            <li><span>Методична скарбничка</span>
                <ul>
                    <li><a href="#">Пункт меню 1</a></li>
                    <li><a href="#">Пункт меню 2</a></li>
                    <li><a href="#">Пункт меню 3</a></li>
               </ul>
            </li>
            <li><span>Контакти</span>
                <ul>
                    <li><a href="#">Пункт меню 1</a></li>
                    <li><a href="#">Пункт меню 2</a></li>
                    <li><a href="#">Пункт меню 3</a></li>
               </ul>
            </li>
        </ul></div>