clip-path-path-003.html (567B)
1 <!DOCTYPE html> 2 <title>CSS Masking: clip-path property and path() function with non-zero reference box offset</title> 3 <link rel="help" href="https://drafts.csswg.org/css-shapes/#basic-shape-functions"> 4 <link rel="help" href="https://drafts.csswg.org/css-shapes/#funcdef-basic-shape-path"> 5 <link rel="match" href="reference/green-100x100.html"> 6 <style> 7 #target { 8 clip-path: path('M0 100h100v100h-100z'); 9 } 10 </style> 11 <svg> 12 <g id="target"> 13 <rect y="-100" width="100" height="300" fill="red"/> 14 <rect width="100" height="100" fill="green"/> 15 </g> 16 </svg>