Create a rounded SVG rectangle with multiple borders?

In XAML there is the concept of a [Border] object that behaves much like an SVG rectangle except that a XAML [Border] can contain a child element.

So I could create a [Border] with a black stroke and inside it have another border that had开发者_如何学JAVA a white stroke and a fill of Green.

This gives the the look of a single rectangle with both a black border & then an inner white border.

How can you create this in SVG?

You need multiple paths. In this particular case you could 'cheat' by having the same path twice, with the lower path having a larger border that appears 'outside' the upper object; in general, though you will need to create paths with offsets if you want this behavior.