Повторить css background image заданное количество раз

Ответ 1

Уродливый взлом может вставляться несколько раз - статически - одно и то же изображение (используя несколько фонов):

например. Повторять по горизонтали изображение (80x80) три раза:

background-image: url('bg_texture.png'), 
                  url('bg_texture.png'),
                  url('bg_texture.png');
background-repeat: no-repeat, 
                   no-repeat,
                   no-repeat;
background-position: 0 top, 
                     80px top,
                     160px top;

Остерегайтесь: не работайте над версией IE под 9 (источник).

Ответ 2

нет.

вы можете установить абсолютную ширину для окна но не существует опции css для повторения изображения n раз.

Ответ 3

Вы можете комбинировать несколько jQuery с CSS для достижения того, чего вы хотите.

Предположим, вы хотите отображать изображение foo.png 3 раза по горизонтали и 2 раза по вертикали.

CSS

body {
    background: url('foo.png');
}

JQuery

$(document).ready(function() {
    $('body').css('background-size', $(window).width()/3 + 'px ' + $(window).height()/2 + 'px');
});

Кроме того, вы можете вставить тот же код в $(window).resize(), чтобы получить динамический ответ.

Ответ 4

Я не уверен, что изначально мотивировало этот вопрос, но я нашел, что он ищет способ убедиться, что появляется только целое число копий фонового изображения (т.е. не обрезать конечного члена повторного набора фона изображения.) Это может быть достигнуто с помощью свойства background-repeat: space.