Задать вопрос
@Josers
html

HTML/CSS кнопка, 3 состояния?

Всем привет! В общем ребят, суть вот в чем, есть 3 изображения кнопки, в разных состояниях (некатив/наведение/нажатие) и нужно как то эту кнопку добавит на сайт, поиски в гугле дали только готовые подобные кнопки на CSS. Заранее благодарен за ответ.
Пример кнопки:
d6c81156.png
Я только начинаю заниматься версткой, так что не кидайтесь тапками будьте добры :) Всем мир
  • Вопрос задан
  • 1309 просмотров
1 комментарий
Подписаться 1 Оценить 1 комментарий
Решения вопроса 2
miraage
@miraage
Старый прогер
Загуглите "css sprite button".
Ответ написан
Комментировать
Комментировать
swipeshot
@swipeshot
Учусь на ошибках.
К :hover, :active добавляйте фоновые изображения.
Button{
}
Button:hover{
}
Button:active{
}

Ставьте ко всем кнопкам одно фоновое изображение, но меняйте его через CSS sprite
Ответ написан
Комментировать
Комментировать
Пригласить эксперта
Ответы на вопрос 2
@Josers Автор вопроса
Всем спасибо за ответы, вот такой код вышел :)
button{
   background:url(css-sprite.png) 0 -55px;
   height:50px;
   width:150px;
   cursor:pointer;
   }
 
button:hover{
   background-position: 0 0;
   }
 
button:active{
   background-position: 0 -109px;
   }
Ответ написан
3 комментария
3 комментария
@A1ike
Я не советую делать кнопки с изображениями (особенно как в Вашем примере, когда можно обойтись чистым css) - максимум с иконками
Ответ написан
5 комментариев
5 комментариев
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
Frontend-разработчик (React)
ДАЛЕЕ
от 130 000 ₽
Тестировщик-стажёр
ITooLabs • Тула
от 35 000 до 40 000 ₽
Fullstack PHP Developer
Smapse Education
от 40 000 до 65 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Клиент для обращения к ByBit Private Api с помощью имеющихся куков
18 апр. 2024, в 14:22
2000 руб./за проект
Развернуть сайт на WordPress
18 апр. 2024, в 14:20
3000 руб./за проект
Frontend для билетной системы (продажа билетов на концерты/спектакли)
18 апр. 2024, в 14:13
50000 руб./за проект
Ещё заказы