Как поставить на фон страницы svg элемент?

Question

[ich_heisse_erich]

Здравствуйте, есть макет сайта, верстаю его и задался вопросом: Как лучше сделать вот эти шары в угол?
Ещё, что лучше в данном случае использовать png картинку или svg файл?
Как думаю я, сделать блок и в css прописать
background-image: url(наша картинка) right top no-repeat;
Это правильное оформление? Есть ли другие варианты?

Comments

[Сергей delphinpro]

Нормальное решение. Картинка может быть svg.

Answer 1

[FORTY YEARS]

С css у вас все правильно, а ниже информация к размышлению.

Плюсы SVG:

• Векторный формат хорошо отображается в любом размере
  
• Возможность создания простых SVG-рендерингов в коде или текстовом редакторе
  
• Дизайн и экспорт сложной графики из Adobe Illustrator или Sketch
  
• Доступен текст SVG
  
• SVG легко стилизовать и написать
  
• Форматы SVG поддерживаются современными браузерами и соответствуют завтрашнему дню
  
• Формат очень сжимаемый и легкий
  
• Хорошо подходит для поиска из-за текстового формата
  
• Поддержка прозрачности
  
• Позволяет сохранять неподвижные или анимированные изображения
  

Минусы SVG:

• Не отображается в некоторых устаревших браузерах
  
• Ограниченная поддержка почтовых клиентов
  
• Дизайн SVG может усложниться
  

Answer 2

[#FFFFFF]

Svg лучше, потому что легче и нормально масштабируется. Я бы вырезала 1 круг с полями и сделала заливку с repeat, так картинка станет ещё легче + можно будет "играть" с размером фонового блока. Соответственно, заливать можно псевдоэлемент, который встанет в правый верхний угол.