Professor Al Fichera
Web Page Design
Cascading Style Sheet Clip Effects
Using CLIP a Style Element Best For Images

The codes above set up two separate clipping regions that are both rectangles (which is the only shape supported so far). Everything within the clipping region will be displayed.

The div.a example (at the right), region is 48 pixels from the top of the box containing the element. The right side is 270 pixels from the left edge of the box. The bottom edge is 267 pixels from the top of the box. And the left side is 50 pixels from the left edge of the box.

The div.b example (at the left), regions are as noted and are read the same way. (The way to read these numbers are clockwise starting from 12 o'clock, 3 o'clock, 6 o'clock, and 9 o'clock. It is always read in this direction.)

You can see the Style block used to create the two class files working on this page in the textarea below.

 

Return to Profal2 Miscellaneous CSS