Отключить сглаживание плиточного фона в Safari

Question

Есть ли способ отключить сглаживание фона в Safari? Я пытаюсь сделать, например, плиточный фон следующим образом:

div#dashed
{
  width: 10rem;
  height: 7rem;
  border: 1px solid #000;
  background: url("https://tut.etogo.net/_files/diagonalbg.png");
}

<div id="dashed">

Итак, фон такой:

И я ожидаю, что фон будет выглядеть так (увеличено):

Но в Safari это выглядит так: Увеличено:

Итак, я вижу, что Safari выполняет сглаживание / сглаживание по краям - есть ли способ отключить его? Я пробовал разные параметры "рендеринга изображений", но безуспешно. Попробовал, что в IE, Edge, FF, Chrome и Opera - все рендерит нормально, но не в Safari. может быть, есть кое-что для этого?

Answer 1

В качестве альтернативы использованию изображения вы можете добиться того же эффекта с помощью чистого CSS.

.gradient {
  width: 200px;
  height: 200px;
  background: repeating-linear-gradient(-45deg, #000, #fff 1px, #fff 15px);
}

<div class="gradient"></div>

Возможно, вы захотите поиграть, чтобы достичь желаемого результата.

Чуть больше информации и подсказок можно найти на https://css -tricks.com / stripes-css /

Answer 2

Я думаю, это потому, что ваш фон был повторен.Вы можете попробовать background-size:cover; background-repeat: no-repeat;

Установка размера для вашего фонового изображения.