svg узор на фоновом изображении

Можно ли поставить шаблон .svg в качестве фонового изображения, шаблон svg должен быть изменен по ширине и высоте окна.


person tetris    schedule 09.06.2011    source источник


Ответы (1)


Это возможно, но ограничено поддержкой браузера. Webkit, как правило, имеет лучшую поддержку SVG, а IE — худшую. Вы можете назначить его с помощью CSS и свойства CSS3 background-size.

body {
  background: url(bg.svg) no-repeat;
  background-size: 100%;
  -o-background-size: 100%;
  -webkit-background-size: 100%;
  -moz-background-size: 100%;
} 

Вы можете получить немного больше поддержки, поместив SVG в <img> и полностью расположив и растянув его за вашим контентом. Это работает, потому что IE исторически больше поддерживает SVG как <img> или <object>, чем как ресурс CSS.

person SpliFF    schedule 09.06.2011
comment
Вы шутите, у webkit лучшая поддержка svg? Оперу еще никто не превзошел . И что касается вашего css, Opera не нуждается в префиксе -o- для размера фона, а оператор без префикса должен быть помещен после всех префиксов. - person Spadar Shut; 09.06.2011