SVG <image>元素用于在SVG图像中嵌入位图。通过使用<image>元素你可以将一张位图绘制在SVG图像上面。下面是一个简单的例子：
<svg xmlns="http://www.w3.org/2000/svg">
<rect x="10" y="10" height="130" width="500" style="fill: #333333"/>
<image x="20" y="20" width="150" height="46"
xlink:href="http://img.htmleaf.com/1506/logo.png" />
<line x1="25" y1="80" x2="350" y2="80"
style="stroke: #ffffff; stroke-width: 3;"/>
<text x="180" y="110" style="fill:#fff;">jQuery之家欢迎您！</text>
</svg>
上面的代码的返回结果是：
在上面的代码中，深灰色的矩形先被绘制出来，然后是jQuery之家的logo被绘制在深灰色的矩形之上，接着是一条白色的直线被绘制在logo的下方，最后是一串SVG文字。
SVG文件中的各个元素的排列顺序就是它们被绘制的顺序，最后绘制的元素被放置在SVG图像的最上方。
除了位图之外，你也可以使用<image>元素来嵌入其他的SVG元素。
<image>元素的浏览器兼容性如下：
- Chrome 1.0+
- Firefox (Gecko) 1.8+
- Internet Explorer 9.0+
- Opera 8.0+
- Safari 3.0.4+
- Android 3.0+
- Firefox Mobile (Gecko) 1.8+
- Safari Mobile 3.0.4+
- IE Mobile 不支持
返回SVG教程目录
相关阅读：
