Хаки и Скрипты Next Generation CMS : Кнопки и иконки, CSS : Очень красивая анимация кнопки на CSS3

irbees2008 Опубликовано - 21 - ноября Кнопки и иконки

Автор: James Brocklehurst
Адаптировал: irbees2008
Источник:
Уровень сложности исполнения: нужны навыки css hmlt
Демо:

Очень красивая анимация кнопки на CSS3,подойдет для красочных и стильных дизайнов.
1.Скачиваем исходник Вы не можете скачивать файлы с нашего сайта ,рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем. .
2.Сам код кнопки простой это ссылка

Код:

<a  class="button" href="#">Я кнопка</a>

3.Ну а теперь стиль

Код:

.button {
display: block;
width: 5em;
padding: 30px 40px;
text-align: center;
font-family: Arial, sans-serif;
font-size: 18px;
color: #fff;
text-decoration: none;
text-shadow: 1px 1px 0px #000;
-moz-border-radius: 25px;
-webkit-border-radius: 25px;
-o-border-radius: 25px;       
border-radius: 25px;
-moz-box-shadow: 2px 2px 10px #000;
-webkit-box-shadow: 2px 2px 10px #000;
-o-box-shadow: 2px 2px 10px #000;
box-shadow: 2px 2px 10px #000;
background: url(images/background.png) no-repeat center -100px;
}

Это простенький вариант,в исходнике есть еще пара примеров

Можешь почитать и вот эту статейку "Добавляем к себе на сайт,легкие,простые ,адаптивные вкладки-табы"

Это тоже интересно

Уважаемый посетитель, Вы зашли на сайт как незарегистрированный пользователь.
Мы рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.