<div><div>
 <ul id="nav1">
 <li>
 <img src="http://site-s-nulya.ru/wp-content/uploads/2014/03/Vsplyivayushhee-menyu-pri-navedenii.jpg" width="500px" height="355px" border="0" />
 <ul>
 <li><a href="http://site-s-nulya.ru/razmeshhenie-bannera-ili-knopki-v-header-wordpress/">Размещение баннера или кнопки в header WordPress</a></li>
 <li><a href="http://site-s-nulya.ru/vyivod-izobrazheniy-na-stranitsah-rubrik-wordpress/">Вывод изображений на страницах рубрик WordPress</a></li>
 <li><a href="http://site-s-nulya.ru/kak-udalit-opredelennyie-rubriki-iz-vidzheta-sayta-na-wordpress/#">Как удалить определенные рубрики из виджета сайта</a></li>
 <li><a href="http://site-s-nulya.ru/individualnyie-izobrazheniya-na-kazhdoy-stranitse-v-shapke-sayta-wordpress/">Индивидуальные изображения на каждой странице в шапке сайта</a></li>
 <li><a href="http://site-s-nulya.ru/smena-izobrazheniya-pri-navedenii-kursora/">Смена изображения при наведении курсора</a></li>
 <li><a href="http://site-s-nulya.ru/obtekanie-izobrazheniy-tekstom-v-wordpress/">Обтекание изображений текстом в WordPress</a></li>
 <li><a href="http://site-s-nulya.ru/oformlenie-tsitat-na-sayte-wordpress/">Оформление цитат на сайте WordPress</a></li>
 <li><a href="http://site-s-nulya.ru/ustanovka-slaydera-v-header-wordpress/">Установка слайдера в header WordPress</a></li>
 <li><a href="http://site-s-nulya.ru/begushhaya-stroka-na-wordpress/">Бегущая строка на WordPress</a></li>
 <li><a href="http://site-s-nulya.ru/auto-highslide-wordpress/">Увеличение изображений при клике в WordPress</a></li>
 <li><a href="http://site-s-nulya.ru/fonovoe-izobrazhenie-v-tekste-wordpress/">Фоновое изображение в тексте WordPress</a></li>
 <li><a href="http://site-s-nulya.ru/tsvetnyie-tekstovyie-bloki-wordpress/">Цветные текстовые блоки WordPress</a></li>
 <li><a href="http://site-s-nulya.ru/vyipadayushhiy-spisok-v-saydbare-wordpress/">Выпадающий список в сайдбаре WordPress</a></li>
 <li><a href="http://site-s-nulya.ru/vyivod-vidzheta-v-lyuboe-mesto-sayta-wordpress/"></a>Вывод виджета в любое место сайта WordPress</a></li>
 <li><a href="http://site-s-nulya.ru/vyivod-bloka-na-opredelennyih-stranitsah-wordpress/">Вывод блока на определенных страницах WordPress</a></li>
 </ul>
 </li>
 </ul>
 </div>
 </div>

//Блок навигации//
#nav1{
float:left;
width:100%;
list-style:none;
font-weight:bold;
margin-bottom:10px;
}
 
#nav1 li{
float:left;
margin-right:10px;
position:relative;
display:block;
}
 
#nav1 li a{
display:block;
padding:5px;
color:#fff;
background:#333;
text-decoration:none;
text-shadow: black 1px 0px, black 1px 1px, black 0px 1px, black -1px 1px, black -1px 0px, black -1px -1px, black 0px -1px, black 1px -1px;
-moz-border-radius:2px;
-webkit-border-radius:2px;
border-radius:2px;
}
 
#nav1 li a:hover{
color:#fff;
background:#eed8ae;
background:rgba(107,12,54,0.75);
text-decoration:underline;
}
 
/ ВЫПАДАЮЩИЕ ПУНКТЫ/
 
#nav1 ul{
list-style:none;
position:absolute;
left:-9999px; /*
opacity:0;
-webkit-transition:0.25s linear opacity;
}
 
#nav1 ul li{
padding-top:1px;
float:none;
background:url(dot.gif);
}
 
#nav1 ul a{
white-space:nowrap;
display:block;
}
 
#nav1 li:hover ul{
left:-15px;
width:500px;
opacity:1;
top: 100px;
}
 
#nav1 li:hover a{
background:#eed8ae;
background:rgba(33,148,228,0.75);
text-decoration:underline;
}
 
#nav1 li:hover ul a{
text-decoration:none;
-webkit-transition:-webkit-transform 0.075s linear;
}
 
#nav1 li:hover ul li a:hover{
background:#333;
background:rgba(51,51,51,0.75);
text-decoration:underline;
-moz-transform:scale(1.05);
-webkit-transform:scale(1.05);
}