Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.67/6: Рейтинг темы: голосов - 6, средняя оценка - 4.67
 Аватар для Братуха
5 / 5 / 5
Регистрация: 15.07.2012
Сообщений: 773

использование спрайтов

23.12.2012, 12:08. Показов 1200. Ответов 6
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Привет всем. У меня есть шесть иконок, которые я решил объединить в спрайт но не знаю как ограничить размер можно. У меня они расположены по две и когда я пытаюсь вывести на экран выходит две. Вот так я подключаю спрайт
CSS
1
2
3
4
5
6
div#get_in ul li {
  background: url(../images/menu/icon_2.png) no-repeat;
     margin:0;
    display:block;
    padding:3px 0 15px 43px;
}
a вот так позицию указываю для каждой иконки
CSS
1
2
3
4
div#get_in ul li.personal {
   background-position: 0px 0px; 
    padding:0 0 5px 43px;
}
Зарание большое спасибо
0
Programming
Эксперт
39485 / 9562 / 3019
Регистрация: 12.04.2006
Сообщений: 41,671
Блог
23.12.2012, 12:08
Ответы с готовыми решениями:

Использование спрайтов - грань между "хорошо" и "плохо"
Здравствуйте! Уважаемые форумчане интересует ваше мнение по поводу использования спрайтов при верстки сайта. Вопрос возник из...

Верстка спрайтов
привет) помогите пожалуйста разобраться. имеется файл .png (спрайт) со множеством иконок. мне необходимо отобразить иконки. вроде все...

Масштабирование спрайтов
Подскажите, как можно масштабировать спрайты?

6
работяга
368 / 368 / 52
Регистрация: 23.05.2010
Сообщений: 947
23.12.2012, 12:17
В
CSS
1
div#get_in ul li
добавьте ширину и высоту картинки. Причём если спрайт горизонтальный, то ширину уменьшите наполовину, если вертикальный, то высоту. И пропишите также (обязательно)
CSS
1
overflow: hidden
1
 Аватар для Братуха
5 / 5 / 5
Регистрация: 15.07.2012
Сообщений: 773
23.12.2012, 12:29  [ТС]
Cамого блока или как-то можно сам размер фона?
0
работяга
368 / 368 / 52
Регистрация: 23.05.2010
Сообщений: 947
23.12.2012, 12:43
Цитата Сообщение от Братуха Посмотреть сообщение
Cамого блока или как-то можно сам размер фона?
Не понял вопроса. Все эти свойства следует применить к тому блоку, к которому указываете спрайт
0
 Аватар для Братуха
5 / 5 / 5
Регистрация: 15.07.2012
Сообщений: 773
23.12.2012, 13:44  [ТС]
Так если я укажу ширину li у меня ссылки будут короткие.
0
работяга
368 / 368 / 52
Регистрация: 23.05.2010
Сообщений: 947
23.12.2012, 13:52
Тогда сделайте вертикальный спрайт, чтобы не ограничивать ширину.
Если высота тоже может варьироваться, то всё-равно можно выкрутиться, разместив изображения в спрайте подальше друг от друга.
1
 Аватар для Братуха
5 / 5 / 5
Регистрация: 15.07.2012
Сообщений: 773
23.12.2012, 13:58  [ТС]
Если честно я так и думал сделать, Спасибо
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
inter-admin
Эксперт
29715 / 6470 / 2152
Регистрация: 06.03.2009
Сообщений: 28,500
Блог
23.12.2012, 13:58
Помогаю со студенческими работами здесь

Распаковка спрайтов
Здравствуйте, есть файл со спрайтами и нужно каждый спрайт сохранить в png. css атласа спрайтов есть. Может кто-нибудь знает инструмент,...

При использовании спрайтов не работают ссылки
Есть два изображения со ссылкой. Я совместил их в один спрайт через бэкграунд. <span class="headbutton1"><a...

Использование спрайтов в js
Привет всем скачал примерчик с js и не знаю как использовать спрайты вместо картинок в общем вот весь код<html> <head> ...

Массив спрайтов
Стоит задача , сделать переключение картинок в image по нажатию кнопки. Для этого нужно создавать массив спрайтов или подгружать картинки...

Массив спрайтов
Как создать массив спрайтов?


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
7
Ответ Создать тему
Новые блоги и статьи
Подключение Box2D v3 к SDL3 для Android: физика и отрисовка коллайдеров
8Observer8 29.01.2026
Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами. Версия v3 была полностью переписана на Си, в. . .
Инструменты COM: Сохранение данный из VARIANT в файл и загрузка из файла в VARIANT
bedvit 28.01.2026
Сохранение базовых типов COM и массивов (одномерных или двухмерных) любой вложенности (деревья) в файл, с возможностью выбора алгоритмов сжатия и шифрования. Часть библиотеки BedvitCOM Использованы. . .
Загрузка PNG с альфа-каналом на SDL3 для Android: с помощью SDL_LoadPNG (без SDL3_image)
8Observer8 28.01.2026
Содержание блога SDL3 имеет собственные средства для загрузки и отображения PNG-файлов с альфа-каналом и базовой работы с ними. В этой инструкции используется функция SDL_LoadPNG(), которая. . .
Загрузка PNG с альфа-каналом на SDL3 для Android: с помощью SDL3_image
8Observer8 27.01.2026
Содержание блога SDL3_image - это библиотека для загрузки и работы с изображениями. Эта пошаговая инструкция покажет, как загрузить и вывести на экран смартфона картинку с альфа-каналом, то есть с. . .
Влияние грибов на сукцессию
anaschu 26.01.2026
Бифуркационные изменения массы гриба происходят тогда, когда мы уменьшаем массу компоста в 10 раз, а скорость прироста биомассы уменьшаем в три раза. Скорость прироста биомассы может уменьшаться за. . .
Воспроизведение звукового файла с помощью SDL3_mixer при касании экрана Android
8Observer8 26.01.2026
Содержание блога SDL3_mixer - это библиотека я для воспроизведения аудио. В отличие от инструкции по добавлению текста код по проигрыванию звука уже содержится в шаблоне примера. Нужно только. . .
Установка Android SDK, NDK, JDK, CMake и т.д.
8Observer8 25.01.2026
Содержание блога Перейдите по ссылке: https:/ / developer. android. com/ studio и в самом низу страницы кликните по архиву "commandlinetools-win-xxxxxx_latest. zip" Извлеките архив и вы увидите. . .
Вывод текста со шрифтом TTF на Android с помощью библиотеки SDL3_ttf
8Observer8 25.01.2026
Содержание блога Если у вас не установлены Android SDK, NDK, JDK, и т. д. то сделайте это по следующей инструкции: Установка Android SDK, NDK, JDK, CMake и т. д. Сборка примера Скачайте. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru