mask-clip-4-ref.html (1021B)
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>CSS mask-clip reference</title> 6 <link rel="author" title="Mozilla" href="https://www.mozilla.org"> 7 <style type="text/css"> 8 svg { 9 position: absolute; 10 top: 10px; 11 border: 1px solid black; 12 } 13 </style> 14 </head> 15 <body> 16 <svg width="200" height="200" style="left: 10px;"> 17 <rect x="50" y="50" width="50" height="50" fill="blue"/> 18 </svg> 19 <svg width="200" height="200" style="left: 220px;"> 20 <rect x="50" y="50" width="50" height="50" fill="blue"/> 21 </svg> 22 <svg width="200" height="200" style="left: 10px; top: 220px;"> 23 <rect x="50" y="50" width="50" height="50" fill="green"/> 24 <rect x="60" y="60" width="40" height="40" fill="blue"/> 25 </svg> 26 <svg width="200" height="200" style="left: 220px; top: 220px;"> 27 <rect x="50" y="50" width="50" height="50" fill="green"/> 28 <rect x="60" y="60" width="40" height="40" fill="blue"/> 29 </svg> 30 </body> 31 </html>