| Главная » Файлы » SCRIPT UCOZ » Кнопки |
Делаем кнопки сбоку сайта
| 11.10.2012, 19:52 | |
| Кнопок может быть любое количество,кнопки могут находиться в любом месте боковой части страницы.Цвет кнопок,размер текста и тип шрифта так же может быть любым.Кнопки могут работать на любой странице,то есть в каждом материале могут быть свои кнопки.Вам потребуется просто скопировать весь код в материал в режиме html редактора материала. Код для кнопки с правой стороны Code <style> a.dsrightbootton{ position: absolute; text-decoration: none; top: 80px; right: 0; font-size: 16px; font-family: 'Tahoma'; font-weight: 700; color:#000; padding: 10px 15px 10px 40px; background:transparent; border:1px solid transparent; /* - Тени для кнопки -*/ -webkit-box-shadow:0px 0px 7px rgba(0,0,0,0.2), 0px 0px 0px 1px rgba(188,188,188,0.1); -o-box-shadow:0px 0px 7px rgba(0,0,0,0.2), 0px 0px 0px 1px rgba(188,188,188,0.1); box-shadow:0px 0px 7px rgba(0,0,0,0.2), 0px 0px 0px 1px rgba(188,188,188,0.1); -webkit-transition:box-shadow 0.3s ease-in-out; -moz-transition:box-shadow 0.3s ease-in-out; -o-transition:box-shadow 0.3s ease-in-out; transition:box-shadow 0.3s ease-in-out; /* - /Тени для кнопки -*/ display: block; } a.dsrightbootton:hover{ padding: 10px 20px 10px 40px; text-decoration: none; } a.dsrightbootton1{ position: absolute; text-decoration: none; top: 130px; right: 0; font-size: 16px; font-family: 'Tahoma'; font-weight: 700; color:#000; padding: 10px 15px 10px 40px; background:transparent; border:1px solid transparent; -webkit-box-shadow:0px 0px 7px rgba(0,0,0,0.2), 0px 0px 0px 1px rgba(188,188,188,0.1); -o-box-shadow:0px 0px 7px rgba(0,0,0,0.2), 0px 0px 0px 1px rgba(188,188,188,0.1); box-shadow:0px 0px 7px rgba(0,0,0,0.2), 0px 0px 0px 1px rgba(188,188,188,0.1); -webkit-transition:box-shadow 0.3s ease-in-out; -moz-transition:box-shadow 0.3s ease-in-out; -o-transition:box-shadow 0.3s ease-in-out; transition:box-shadow 0.3s ease-in-out; display: block; } a.dsrightbootton1:hover{ padding: 10px 20px 10px 40px; text-decoration: none; } </style> <a class="dsrightbootton" href="#"> В Х О Д</a> <a class="dsrightbootton1" href="#">В Ы Х О Д</a> Код для кнопки с левой стороны Code <style> a.dsleftbootton{ position: absolute; text-decoration: none; top: 80px; left: 0; font-size: 16px; font-family: 'Tahoma'; font-weight: 700; color:#000; padding: 10px 40px 10px 15px; font-weight: 700; background:#fff; border:1px solid transparent; /* - Тени для кнопки -*/ -webkit-box-shadow:0px 0px 7px rgba(0,0,0,0.2), 0px 0px 0px 1px rgba(188,188,188,0.1); -o-box-shadow:0px 0px 7px rgba(0,0,0,0.2), 0px 0px 0px 1px rgba(188,188,188,0.1); box-shadow:0px 0px 7px rgba(0,0,0,0.2), 0px 0px 0px 1px rgba(188,188,188,0.1); -webkit-transition:box-shadow 0.3s ease-in-out; -moz-transition:box-shadow 0.3s ease-in-out; -o-transition:box-shadow 0.3s ease-in-out; transition:box-shadow 0.3s ease-in-out; /* - /Тени для кнопки -*/ display: block; } a.dsleftbootton:hover{ padding: 10px 40px 10px 20px; text-decoration: none; } a.dsleftbootton1{ position: absolute; text-decoration: none; top: 130px; left: 0; font-size: 16px; font-family: 'Tahoma'; font-weight: 700; color:#000; padding: 10px 40px 10px 15px; font-weight: 700; background:#fff; border:1px solid transparent; /* - Тени для кнопки -*/ -webkit-box-shadow:0px 0px 7px rgba(0,0,0,0.2), 0px 0px 0px 1px rgba(188,188,188,0.1); -o-box-shadow:0px 0px 7px rgba(0,0,0,0.2), 0px 0px 0px 1px rgba(188,188,188,0.1); box-shadow:0px 0px 7px rgba(0,0,0,0.2), 0px 0px 0px 1px rgba(188,188,188,0.1); -webkit-transition:box-shadow 0.3s ease-in-out; -moz-transition:box-shadow 0.3s ease-in-out; -o-transition:box-shadow 0.3s ease-in-out; transition:box-shadow 0.3s ease-in-out; /* - /Тени для кнопки -*/ display: block; } a.dsleftbootton1:hover{ padding: 10px 40px 10px 20px; text-decoration: none; } </style> <a class="dsleftbootton" href="#"> В Х О Д</a> <a class="dsleftbootton1" href="#">В Ы Х О Д</a> | |
| Просмотров: 1165 | Загрузок: 0 | | |
| Всего комментариев: 0 | |