respsvg.html

<!-- one image

you could imagine, for example, 
  icon.svg#tiny referring to an icon for display on 3x3" display
  icon.svg#small referring to an icon on a portrait-oriented phone
  icon.svg#default referring to an icon that will be large enough to resolve all detail
-->
<picture>
  <source media="(max-width: 12em)" src="icon.svg#tiny">
  <source media="(max-width: 24em)" src="icon.svg#small">
  <img src="icon.svg#default" width="30" height="20">
</picture>

<!-- or multiple discrete images -->
<picture>
  <source media="(max-width: 12em)" src="icon-tiny.svg">
  <source media="(max-width: 24em)" src="icon-small.svg">
  <img src="icon.svg" width="30" height="20">
</picture>