|
|
|
|
|
|
| |
The clip property (CSS Reference)
Introduction
The clip property can be used to show only some portion of
the element. If the element is bigger than the defined display area than it
will cut off the sides of the element. The following example demonstrates it.
Example
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
img.clip
{
clip:rect(10px
150px 150px 70px);
position:absolute;
}
</style>
<title>clip Demonstration</title>
</head>
<body>
<h1><p>See how the first image is cut
off.</p></h1>
<h2>Clipped image</h2>
<img class="clip"
src="area.jpg"><br/><br><br/><br><br/><br><br/><br>
<h2>Normal image</h2>
<img src="area.jpg">
</body>
</html>
Output
Values
|
Name:
|
Description:
|
|
auto
|
The visible portion will be specified automatically.
|
|
rect(top, right, bottom, left)
|
This value specifies the display area in which the element
is placed. There aren’t any other shapes currently available. You can use one
of the following options to specify the values in the rect:
cm (centimeter)
em (ems)
inch (inches)
mm (millimeters)
pc (picas)
px (pixels)
pt (points)
|
|
|
|
|
|
|
|
|
Email TopXML