Главная » Файлы » Скрипты плагины и дополнения » Разное

Красивая стилизация input type с помощью CSS3

Все мы знаем, что формы ввода на сайта достаточно примитивны и однообразны. Сегодня мы подойдем к данному вопросу с достаточно элегантной точки зрения современного веб-дизайна. Мы рассмотрим процесс адаптивной стилизации input type с помощью CSS3. Изменив стили на ниже указанные вы получите стилизацию всех форм которые есть у Вас на сайте на желаемый. И так, давайте посмотрим, что у нас получилось. Мы создадим эффект легкой объемности, чтобы подчеркнуть форму, также будет установленная небольшая прозрачность, все это превращается в стильную форму. Так как разметка все Вам знакома, мы рассмотрим только стили CSS. Шаг 1. CSS Код input { padding: 10px; font-size: 30px; border: 10px solid rgba(255, 255, 255, .5); @include box-shadow( 0 2px 10px rgba(0, 0, 0, .25) inset, 0 2px 10px rgba(0, 0, 0, .25)); @include border-radius(10px); background: rgba(255, 255, 255, .5); @include appearance(none); outline: none; color: #333; width: 50%; position: absolute; left: 25%; } На этом всё! Поделись ссылкой с друзьями:
Демо Просмотров: 1528	17.03.2014, 23:37
1 2 3 4 5 Категория: Разное \| Добавил: туссин \| Теги: css, input type, Форма поиска
Просмотров: 1528 \| Загрузок: 0 \| Рейтинг: 5.0/1

Рекомендую к прочтению

Иконки групп от нас(web-mas.ru)	Explorer шаблон для Ucoz
Страница технических работ для uCoz	Game Arena шаблон для Ucoz
Sakura шаблон для Ucoz	Liberation шаблон для Ucoz