Что такое CSS спрайты?

admin

CSS спрайты — это специальная техника, когда мелкие картинки объединяются в один файл и выводятся не с помощью тега <img>, а с помощью CSS. Допустим, у нас есть большой файл с картинками icons.png. Тогда пример использования выглядел бы так:

.icon {background: url(/icons.png); height: 32px; width: 32px;display: inline-block;}
.icon_open {background-position: -64px 0px;}

Допустим, что размер иконок 32х32 и нужная нам иконка идет третей в первом ряду (в спрайте)

<span class="icon icon_open"></span> Открыть что-то

Пример использования в HTML

Compass — удобный инструмент для работы со спрайтами.

Этот текст был написан несколько лет назад. С тех пор упомянутые здесь инструменты и софт могли получить обновления. Пожалуйста, проверяйте их актуальность.

Останні статті

Что такое прокси-сервер: пояснение простыми словами, зачем нужны прокси

Прокси (proxy), или прокси-сервер — это программа-посредник, которая обеспечивает соединение между пользователем и интернет-ресурсом. Принцип…

21.11.2024

Что такое PWA приложение? Зачем необходимо прогрессивное веб-приложение

Согласитесь, было бы неплохо соединить в одно сайт и приложение для смартфона. Если вы еще…

19.11.2024

Как создать игру на телефоне: программирование с помощью конструктора

Повсеместное распространение смартфонов привело к огромному спросу на мобильные игры и приложения. Миллиарды пользователей гаджетов…

17.11.2024

Google Bard: эффективный аналог ChatGPT

В перечне популярных чат-ботов с искусственным интеллектом Google Bard (Gemini) еще не пользуется такой популярностью…

14.11.2024

Скрипт и программирование: что это такое простыми словами

Скрипт (англ. — сценарий), — это небольшая программа, как правило, для веб-интерфейса, выполняющая определенную задачу.…

12.11.2024

Дедлайн в разработке: что это такое простыми словами

Дедлайн (от англ. deadline — «крайний срок») — это конечная дата стачи проекта или задачи…

11.11.2024