| <!DOCTYPE HTML> |
| <html> |
| <head> |
| <meta charset="utf-8"> |
| <title>CSS mask-clip reference</title> |
| <link rel="author" title="CJ Ku" href="mailto:[email protected]"> |
| <link rel="author" title="Mozilla" href="https://www.mozilla.org"> |
| <style type="text/css"> |
| svg { |
| position: absolute; |
| top: 10px; |
| border: 1px solid black; |
| } |
| </style> |
| </head> |
| <body> |
| <svg width="200" height="200" style="left: 10px;"> |
| <rect x="20" y="20" width="100" height="100" fill="blue"/> |
| </svg> |
| <svg width="200" height="200" style="left: 220px;"> |
| <rect x="50" y="50" width="50" height="50" fill="blue"/> |
| </svg> |
| <svg width="200" height="200" style="left: 10px; top: 220px;"> |
| <rect x="50" y="50" width="50" height="50" fill="green"/> |
| <rect x="60" y="60" width="40" height="40" fill="blue"/> |
| </svg> |
| </body> |
| </html> |
