Я форматирую с CSS3. У меня слишком большое изображение, которое я использую для пуль. Я хочу, чтобы пуля автоматически изменялась до размера шрифта. Могу ли я это сделать?Пулевое изображение Автоматическое определение размера
Если нет, (darn), как бы я установил изображение-пулю в определенный размер? (Такие, как 12 высоты, и авто-масштабируется ширина)
ul {
list-style-image: url('rectangular_bullet_image.jpg')
}
Если вы хотите, чтобы масштабировать до высоты li, затем используйте решение Михнеа.
Если вы хотите, чтобы масштабировать до размера шрифта, используйте
ul li {
padding-left: 20%;
background: url('rectangular_bullet_image.jpg') no-repeat left top;
background-size: auto 1em;
}
где последний размер (1em) относится к размеру шрифта. Итак, если вы хотите, чтобы он был немного больше шрифта, установите значение 1.2em
Обратите внимание, что 2 решения примерно одинаковы, если у li есть только одна строка.
Это для многострочной линии, что есть разница.
попробовать что-то вроде этого
ul {
list-style-type: none;
padding: 0;
}
ul li {
padding-left: 20%;
background: url('rectangular_bullet_image.jpg') no-repeat left top;
background-size: 20% 100%;
}
Heres это скрипку с ним http://jsfiddle.net/YUjdz/1/
Зачем использовать * большое * изображение для списка bullet? Но если вы хотите, чтобы он был изменен, я бы предложил использовать пользовательский шрифт или символ Unicode и 'li: before'. – Blazemonger
Избегайте отображения в стиле списка - вам не нужно контролировать размещение или размер изображения. Вместо этого используйте фон CSS. –