🚀 Мои услуги
Header Image
пр. Мира 620000 Россия +7900-000-00-00
Логотип блога интернет-бродяги

Как сделать иконку «Гамбургер» на CSS

Гамбургер
Обновлено: 2023-07-04 в 18:26
Актуально на 2025 год
Просмотры: 162

В этой короткой заметке покажу, как сделать иконку «Гамбургер» на CSS. Три параллельные горизонтальные полоски, или как их еще называют «Гамбургер», обычно используется для обозначения меню на сайте.

На одном из сайтов сначала я использовал изображение для обозначения меню. Но однажды мне пришла идея заменить картинку на HTML и CSS код.

Сделать это достаточно просто. Напишем HTML-каркас и немного стилизуем его.

Добавил стили. Сначала описал подложку, а затем и полоски.

Посмотрите демонстрацию кода.

ytprevyu

Всем WEB!

Если материал оказался полезен и помог решить проблему, можете поддержать автора, направив камеру смартфона на QR-код.
QR-Сбер

Оцените статью:

Рейтинг: 0.0 (Голосов: 0)

Почитайте похожие материалы

Об авторе: Hobo

Занимаюсь созданием и оптимизацией сайтов, о чём и пишу в этом блоге. Иногда делюсь опытом использования различной техники, которая побывала у меня в руках.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

SQL - 68 | 0,070 сек. | 6.25 МБ