HTML CSS examples for SVG:Image
Text with image background in svg
<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style id="compiled-css" type="text/css"> svg {<!--from www .j a v a 2 s . com--> background:#ddd; position:absolute; top:0; left:0; width:100%; height:100%; } text { font-size:160pt; font-weight:bold; stroke:#000 } </style> </head> <body> <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <defs> <pattern id="p1" patternunits="userSpaceOnUse" width="32" height="32"> <image xlink:href="https://www.java2s.com/style/demo/Google-Chrome.png" width="32" height="32" /> </pattern> <pattern id="p2" patternunits="userSpaceOnUse" width="10" height="10"> <image xlink:href="https://www.java2s.com/style/demo/Firefox.png" width="10" height="10" /> </pattern> </defs> <text x="20" y="170" fill="url(#p1)"> test <tspan x="20" y="350" fill="url(#p2)"> test <tspan fill="url(#p1)"> test </tspan> test </tspan> </text> </svg> </body> </html>