|
+
6.1 The clipPath element |
|---|
|
clip-path-element-userspaceonuse-001 |
= |
|
CSS Masking: Test clip-path property and external clipPath reference with userSpaceOnUse - 1
- The clip-path property takes an external reference to a clipPath element for clipping. On pass you should see a green box.
|
|
clip-path-element-userspaceonuse-002 |
= |
|
CSS Masking: Test clip-path property and external clipPath reference with userSpaceOnUse - 2
- The clip-path property takes an reference to a clipPath element for clipping. On pass you should see a green with a blue border.
|
|
clip-path-element-userspaceonuse-003 |
= |
|
CSS Masking: Test clip-path property and external clipPath reference with userSpaceOnUse with percentage - 1
- The clip-path property takes a reference to a clipPath element for clipping. Percentage values are relative to the viewport for userSpaceOnUse on clipPathUnits. On pass the left half of the site is white and the right half of the site is green.
|
|
clip-path-element-userspaceonuse-004 |
= |
|
CSS Masking: Test clip-path property and external clipPath reference with userSpaceOnUse with percentage - 2
- The clip-path property takes a reference to a clipPath element for clipping. Percentage values are relative to the viewport for userSpaceOnUse on clipPathUnits. On pass the top half of the site is white and the bottom half of the site is green.
|
|
clip-rule-001 |
= |
|
CSS Masking: Test clip-rule property on polygon clip rule evenodd
- The clipPath element takes the basic shape 'polygon' for clipping. The point list for the polygon creates a 'whole' with the dimension of the background. With the clip rule 'evenodd', this whole is clipped out. The clipping makes the green background of the parent div box visible. On pass you should see a green box with a blue border.
|
|
clip-rule-002 |
= |
|
CSS Masking: Test clip-rule property on polygon clip rule nonzero
- The clipPath element takes the basic shape 'polygon' for clipping. The point list for the polygon creates a 'whole' with the dimension of the background. With the clip rule 'nonzero', this whole is clipped out. The clipping makes the green background of the parent div box visible. On pass you should see a green box with a blue border.
|