<!doctype html> <html> <head> <meta charset="UTF-8"> <title>Mobile-Web-App: HTML5 svg LinearGradient</title> </head> <body> <h1>Mobile-Web-App: HTML5 Scalable Vector Graphics (svg)</h1> <svg width="400" height="300"> <rect x="0" y="0" width="400" height="300" stroke="black" stroke-width="1" fill="white" /> <defs> <pattern id="mypattern1" x="0" y="0" width="30" height="30" viewBox="0 0 30 30" patternUnits="userSpaceOnUse"> <circle cx="15" cy="15" r="12" stroke="blue" stroke-width="3" fill="yellow"/> </pattern> <pattern id="mypattern2" x="0" y="0" width="48" height="48" viewBox="0 0 48 48" patternUnits="userSpaceOnUse"> <image x="0" y="0" width="48" height="48" xlink:href="Mobile-Web-App.png" ></image> </pattern> </defs> <rect x="10" y="10" width="290" height="50" stroke="black" fill="url(#mypattern1)"/> <rect x="10" y="80" width="290" height="200" stroke="black" fill="url(#mypattern2)"/> </svg> </body> </html>
No comments:
Post a Comment