Меню сайта с красивой анимацией на CSS


Навигация вертикальном виде, которая полностью создана на стилях, где также присутствует уникальный эффект, что производится при наведении. На простом сайте, это как софт портал или кино сайт, не думаю, что будет отличным решением. Его безусловно создавали для современных площадок, где палитра цвета не главная, так как она быстро изменяется веб мастеров. Здесь больше всего на сам эффект сделано, что реально привлекает своей значимостью и безусловно анимацией. Можно поставить как в блок или найти другой элемент и задействовать в совершенно другой функций. 

HTML-списки - это ресурс широко используемый веб-дизайнерами и разработчиками, а также блогерами, но по правде говоря, по умолчанию они склонны к довольно недоеданию при разработке. В этом посте вы увидите один такой список на CSS, делая ему гораздо более современный вид. Преимущество всего этого заключается в том, что вы можете настроить эти стили и создать свои собственные списки с эффектами, о которых вы можете думать. 

HTML 
 

<div class="songalen_zotsabtum">
    <ul>
        <li><a href="http://cssave.at.ua/">CSSAVE.AT.UA 1</a></li>
        <li><a href="http://cssave.at.ua/">CSSAVE.AT.UA 2</a></li>
        <li><a href="http://cssave.at.ua/">CSSAVE.AT.UA 3</a></li>
        <li><a href="#">CSSAVE.AT.UA 4</a></li>
        <li><a href="#">CSSAVE.AT.UA 5</a></li>
         <li><a href="#">CSSAVE.AT.UA 6</a></li>
        <li><a href="#">CSSAVE.AT.UA 7</a></li>
    </ul>
</div>


CSS 
 

.songalen_zotsabtum ul {  
  list-style:none;  


.songalen_zotsabtum ul li {  
  font-family:Georgia,serif,Times;  
  font-size:17px;  


.songalen_zotsabtum ul li a { 
  display: block; 
  width: 295px; 
  height: 27px; 
  background-color: #1f1c1c; 
  border-left: 4.7px solid #252323; 
  border-right: 4.5px solid #424040; 
  padding-left: 10px; 
  text-decoration: none; 
  color: #e5f2f9; 


.songalen_zotsabtum ul li a:hover { 
  transform: rotate(4deg); 
  box-shadow: 9px 9px 18px #151414; 
  margin-left: 11px; 
}


Как можно заметить, что также присутствуют стили, у кото алимента, на который наводишь клик. 


Комментариев 0
Привет, оставишь комментарий?
Имя:*
E-Mail:


Внимание!

Пожертвование
Мы принимаем WebMoney

R807857153548
Z417987712394
B281910665473
Обновления new
  • Переход направление вверх и вниз на CSS
  • Эффект направление вверх и вниз выпадающего списка, который создан при помощи CSS, где может скрыть информацию и по клику открыть список.

  • Wonde - универсальный бизнес шаблон для uCoz
  • Бесплатный новостной шаблон сайта в стиле минимализма. Хорошее решение для ведения своего блога или портала новостей. Все чисто и аккуратно.&nbs ..

  • Горизонтальный топ пользователей по репутации для uCoz
  • Топ пользователей по репутации как на RootGames.Ru на данный момент, пример можете увидеть в персональной странице пользователя в са ..

  • Переключатель с использованием CSS и JS
  • Думаю многим интересно процесс создания оригинальных переключателей, которые можно увидеть на любом тематическом сайте под функцией.

  • Выпадающее горизонтальное меню с помощью CSS
  • По сути выпадающее меню или навигация представляет собой горизонтальный список разнообразных, но скорей всего тематических запросов под параметр ..

Информация