Размер картинки в фоновом режиме повторить?

Question

Надеюсь, все у вас хорошо получается.

У меня есть область на веб-странице, где я хочу добавить фоновое изображение.

У меня есть два изображения.

Один У меня есть фоновое изображение значка , размер небольшого блока которого почти равен 5 КБ

. И у меня есть фоновое изображение, которое соответствует всему фону размером почти 100 КБ. который подходит к экрану. image

Я хочу улучшить скорость страницы, поэтому, если я добавлю небольшое изображение значка, которое повторяет меня и хорошо выглядит на заднем плане.

Подскажите, пожалуйста, когда повторение изображения в фоновом режиме также увеличивает его размер, как если бы размер теперь составлял 5 КБ, когда изображение повторяется еще раз, а его размер теперь составляет 10 КБ?

Можете ли вы предложить мне, какое из них мне нужно использовать одно большое изображение или маленькие иконки повторяются.

Надеюсь, вы поняли мою точку зрения.

Answer 1

Используйте маленькую иконку, желательно изображение GIF. Как только это будет сделано, вам необязательно указывать размер.

Код ниже повторяет фоновое изображение как по вертикали, так и по горизонтали

 body {   background-image: url("my_image.gif");   
          background-repeat: repeat; 
      }

Если вы хотите повторить его по горизонтали, используйте код ниже

body {
  background-image: url("my_image.gif");
  background-repeat: repeat-x;
}

Answer 2

Для полного описания того, как это работает go по этой ссылке, но для решения вам нужен код также ниже

https://www.w3schools.com/cssref/pr_background-repeat.asp

если вы хотите повторить его по горизонтали, вы можете использовать:

background-repeat: repeat-x;

если использовать по вертикали:

background-repeat: repeat-y;

если вы хотите, чтобы он не повторялся, используйте:

background-repeat: no-repeat;

надеюсь, что это решение поможет