О сайте | Обратная связь | Памятка для вебмастера
[ Регистрация · Войти · Новые сообщения · Участники · Правила форума · Поиск · RSS ]
Страница 1 из 212»
Модератор форума: Гром, Anka_kuşu, Souteneur 
Форум » Создание сайта » Общие вопросы » Css спрайт
Css спрайт
Anka_kuşu Дата: Среда, 30.11.2011, 13:55 | Сообщение # 1
Студент(ка)
Награды: 6
Сообщений: 376
Репутация: 36
Статус: Offline
Можно ли использовать изображение которое будет повторяться(например для фона)?
Если есть код спрайта,то как его правильно добавить в css.

Т.е. как я понял везде надо поменять название изображение на изображения спрайта и прописать эти позиции.


Я знаю только то, что я ничего не знаю, но некоторые не знают и этого.
otlichnica Дата: Среда, 30.11.2011, 17:18 | Сообщение # 2
Профессор(ша)
Награды: 81
Группа: Администраторы
Сообщений: 9888
Город: Астрахань
Репутация: 287
Статус: Offline
Anka_kuşu, так ответить на твой вопрос очень сложно, нужен конкретный пример.

Делаю сайты под ключ на заказ. Меняю шапки и цветовую гамму на Вашем сайте Портфолио и расценки

В выходные я не работаю!!!
Гром Дата: Среда, 30.11.2011, 17:28 | Сообщение # 3
Профессор(ша)
Награды: 11
Сообщений: 3350
Город: Астрахань
Репутация: 96
Статус: Offline
http://dimonblog.ru/css/css-sprajty/

Профессиональный подход к созданию сайтов под ключ.
Все услуги в одном месте.
Домен второго уровня и хостинг на год в подарок!
Anka_kuşu Дата: Вторник, 06.12.2011, 00:36 | Сообщение # 4
Студент(ка)
Награды: 6
Сообщений: 376
Репутация: 36
Статус: Offline
Гром,Отличница
а почему вы не используете оптимизацию загрузки сайта(css спрайты,кэш)

Добавлено (06.12.2011, 00:36)
---------------------------------------------
Гром,Отличница
а почему вы не используете оптимизацию загрузки сайта(css спрайты,кэш)?


Я знаю только то, что я ничего не знаю, но некоторые не знают и этого.

Сообщение отредактировал Anka_kuşu - Четверг, 01.12.2011, 17:30


otlichnica Дата: Вторник, 06.12.2011, 20:58 | Сообщение # 5
Профессор(ша)
Награды: 81
Группа: Администраторы
Сообщений: 9888
Город: Астрахань
Репутация: 287
Статус: Offline
Anka_kuşu, я использую минимум картинок, мне нечего засовывать в спрайт

Делаю сайты под ключ на заказ. Меняю шапки и цветовую гамму на Вашем сайте Портфолио и расценки

В выходные я не работаю!!!
KorniloFF Дата: Среда, 07.12.2011, 00:27 | Сообщение # 6
Профессор(ша)
Награды: 27
Группа: Администраторы
Сообщений: 3513
Город: Ялта
Репутация: 251
Статус: Offline
Anka_kuşu, поскольку у нас с Громом совместный веб-проект, скажу, что нам спрайты пока без надобности. Но вещь неплохая!



Z146965124780
R374477004237
Ну, или хотя бы добавьте в репутацию.
Anka_kuşu Дата: Среда, 07.12.2011, 14:51 | Сообщение # 7
Студент(ка)
Награды: 6
Сообщений: 376
Репутация: 36
Статус: Offline
У вас на сайтах все очень не плохо,но у отличницы на этом сайте (http://mamahealth.ru/),очень маленький показатель(смотрел с помощью программы).

Я знаю только то, что я ничего не знаю, но некоторые не знают и этого.
Гром Дата: Среда, 07.12.2011, 15:26 | Сообщение # 8
Профессор(ша)
Награды: 11
Сообщений: 3350
Город: Астрахань
Репутация: 96
Статус: Offline
Quote (Anka_kuşu)
У вас на сайтах все очень не плохо

А то! Так и задумывалось :)


Профессиональный подход к созданию сайтов под ключ.
Все услуги в одном месте.
Домен второго уровня и хостинг на год в подарок!
Fearfire Дата: Суббота, 05.01.2013, 02:24 | Сообщение # 9
Третьеклашка
Группа: Пользователи
Сообщений: 25
Город: Томск
Репутация: 0
Статус: Offline
Проблема: неправильно отображаются css спрайты


сам спрайт, рамка для фото:


CSS
Код
.border_009, .border_008, .border_007, .border_006, .border_004, .border_003, .border_002, .border_001{
background: url('/border_photo/sprites.png') no-repeat;
  width: 17px; height: 17px;
  }    

.border_009 {
background-position: -100px -100px;
}

.border_008{
background-position: -50px -100px;
}

.border_007{
background-position: 0 -100px;
}

.border_006{
background-position: -100px -50px;
}

.border_004{
background-position: 0 -50px;  
}

.border_001{
background-position: 0 0;  
}

.border_002{
background-position: -50px 0;  
}

.border_003{
background-position: -100px 0;  
}


Вызов спрайта через таблицу
Код
<div align="center">  
  <table border="0" cellpadding="0" cellspacing="0">  
  <tbody><tr>  
  <td class="border_001">  
  </td>  
  <td class="border_002">  
  </td>  
  <td class="border_003">  
  </td>  
  </tr>  
  <tr>  
  <td class="border_004">  
  </td>  
  <td>  
  ... .... ...
  </td>  
  <td class="border_006">  
  </td>  
  </tr>  
  <tr>  
  <td class="border_007">  
  </td>  
  <td class="border_008">  
  </td>  
  <td class="border_009">  
  </td>  
  </tr>  
  </tbody></table> </div>


Вопрос: где исправить код чтобы рамка была нормальной?
KorniloFF Дата: Суббота, 05.01.2013, 15:43 | Сообщение # 10
Профессор(ша)
Награды: 27
Группа: Администраторы
Сообщений: 3513
Город: Ялта
Репутация: 251
Статус: Offline
Fearfire, а зачем вам такой спрайт вообще? Почитайте про свойство ксс-3 box-shadow:
Код
Описание
Добавляет тень к элементу. Допускается использовать несколько теней, указывая их параметры через запятую, при наложении теней первая тень в списке будет выше, последняя ниже. Если для элемента задается радиус скругления через свойство border-radius, то тень также получится с закругленными уголками. Добавление тени увеличивает ширину элемента, поэтому возможно появление горизонтальной полосы прокрутки в браузере.

Синтаксис
box-shadow: none | <тень> [,<тень>]*
где <тень>:
inset <сдвиг по x> <сдвиг по y> <радиус размытия> <растяжение> <цвет>

Значения
none Отменяет добавление тени.  
inset Тень выводится внутри элемента. Необязательный параметр.  
сдвиг по x Смещение тени по горизонтали относительно элемента. Положительное значение этого параметра задает сдвиг тени вправо, отрицательное — влево. Обязательный параметр.  
сдвиг по y Смещение тени по вертикали относительно элемента. Положительное значение задает сдвиг тени вниз, отрицательное — вверх. Обязательный параметр.  
размытие Задает радиус размытия тени. Чем больше это значение, тем сильнее тень сглаживается, становится шире и светлее. Если этот параметр не задан, по умолчанию устанавливается равным 0, тень при этом будет четкой, а не размытой.  
растяжение Положительное значение растягивает тень, отрицательное, наоборот, ее сжимает. Если этот параметр не задан, по умолчанию устанавливается 0, при этом тень будет того же размера, что и элемент.  
цвет Цвет тени в любом доступном CSS формате, по умолчанию тень черная. Необязательный параметр.  
Допускается указывать несколько теней, разделяя их параметры между собой запятой. Учитывается следующий порядок: первая тень в списке размещается на самом верху, последняя в списке — в самом низу.

При помощи него в 1 строку кода в стилях вы сможете добиться тех же самых эффектов.




Z146965124780
R374477004237
Ну, или хотя бы добавьте в репутацию.
Форум » Создание сайта » Общие вопросы » Css спрайт
Страница 1 из 212»
Поиск:
Css спрайт - Создание сайта - Общие вопросы - Форум
Сегодня были на форуме:
oksanachyumakova, lexuss18, anatoliekruglov, a_doleva

Конструктор кнопок он-лайн


Получить код CSS

Подбор цветов

Справочник по html и CSS

Наши копирайтеры

Поиск