HTML CSS examples for SVG:Rectangle
Use Multiple preserve Aspect Ratio in svg
<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style id="compiled-css" type="text/css"> body {<!--from w w w. java 2 s. c o m--> margin: 0; padding: 0; } svg { width: 100vw; height: 100vh; } </style> </head> <body> <svg viewbox="0 0 2880 1620"> <mask id="mask" maskunits="userSpaceOnUse" maskcontentunits="userSpaceOnUse" x="-1000%" y="-1000%" width="3000%" height="3000%"> <rect fill="white" x="-1000%" y="-1000%" width="3000%" height="3000%" /> <circle cx="1440" cy="810" r="400" fill="black" /> </mask> <rect mask="url(#mask)" x="-1000%" y="-1000%" width="3000%" height="3000%" /> </svg> </body> </html>