Главная » Файлы » Прочие скрипты » CSS

Красивое меню на чистом CSS by slavick
24.06.14, 17:00:02


Посмотрите ДЕМО
В то место где будет меню
Код
<li id="hMenu"><a href="#" class="hmenuA">Главная</a></li>  

  <li id="hMenu"><a href="#" class="hmenuA">Каталог Файлов</a></li>  

  <li id="hMenu"><a href="#" class="hmenuA">Каталог Статей</a></li>  

  <li id="hMenu"><a href="#" class="hmenuA">Блог</a></li>


в CSS
Код
#hMenu {  
  list-style-type:none;  
  background:#EBEBEB;  
  padding:3px;  
  width:150px;  
  text-align: left;  
  border-radius:10px;  
  margin: 5px;  
  box-shadow: 0 0 5px 0 #000;  
  }  
  .hmenuA {  

  padding:3px;  
  display:block;  
  text-decoration:none;  
  color:#323232;  
  }  
  .hmenuA:hover {  
  padding:3.5px;  
  display:block;  
  text-decoration:none;  
  background:#BBBBBB;  
  box-shadow: 0 0 5px 0 #000;  
  border-radius:10px;  
  }


И вот еще меню с внутренней тенью


ДЕМО
CSS
Код
#hMenu {  
  list-style-type:none;  
  background:#EBEBEB;  
  padding:3px;  
  width:150px;  
  text-align: left;  
  border-radius:10px;  
  margin: 5px;  
  box-shadow: inset 0 0 5px 0 #000;  
  }  
  .hmenuA {  

  padding:3px;  
  display:block;  
  text-decoration:none;  
  color:#323232;  
  }  
  .hmenuA:hover {  
  padding:3.5px;  
  display:block;  
  text-decoration:none;  
  background:#BBBBBB;  
  box-shadow: 0 0 5px 0 #000;  
  border-radius:10px;  
  }

Категория: CSS | Добавил: Apocalypse | Теги: CSS, красивое, чистом, by, на, slavick, Меню
Просмотров: 348 | Загрузок: 0 | Рейтинг: 0.0/0
Всего комментариев: 0
Имя *:
Email: