<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
ul.menu {
box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.5);
background-color: #fff;
border-radius: 4px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
width: 70%;
height: 80px;
margin:0 auto;
padding:0 auto;}
ul.menu>li {
display:inline-block;
list-style: none;
position: relative;
}
ul.menu>li>a {
color: rgb(128,128,128);
display: block;
padding:15px;
text-decoration: none;
margin: 15px 15px 15px 35px;
}
ul.menu>li>a:hover {
background-color:#fff;
border-radius:12px;
padding:15px;
box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.5);
}
</style>
<title>Горизонтальное выпадающее меню</title>
</head>
<body>
<ul class="menu">
<li><a href="">Главная</a></li>
<li><a href="">О компании</a></li>
<li><a href="">Услуги</a></li>
<li><a href="">Фотогалерея</a></li>
<li><a href="">Цены</a></li>
<li><a href="">Отзывы</a></li>
<li><a href="">Контакты</a></li>
</ul>
</body>
</html>
pyrokinesis 
Комментарии (0)