mozilla

Revision 69243 of <shape>

  • Revision slug: CSS/shape
  • Revision title: shape
  • Revision id: 69243
  • Created:
  • Creator: BijuGC
  • Is current revision? No
  • Comment /* Values */

Revision Content

{{ CSSRef() }}

Summary

A shape is a value for CSS property like {{ Cssxref("clip") }}.

Syntax

 <a_css_property> : rect(<top>, <right>, <bottom>, <left>) ;

Values

<top>, <bottom>
specify offsets from the top border edge of the box.
<right>, <left>
specify offsets from the left border edge of the box normally (ie, in left-to-right text). For a box in right-to-left text they will indicate offset from right border edge.

Examples

 img.clip04 { 
   clip: rect(10px, 20px, 20px, 10px);
 }

Notes

Specifications

Browser compatibility

See also

Revision Source

<p> {{ CSSRef() }}
</p>
<h3 name="Summary"> Summary </h3>
<p>A shape is a value for <a href="en/CSS_Reference">CSS property</a> like {{ Cssxref("clip") }}. </p>
<h3 name="Syntax"> Syntax </h3>
<pre class="eval"> <i>&lt;a_css_property&gt;</i> : <span class="nowiki">rect(&lt;top&gt;, &lt;right&gt;, &lt;bottom&gt;, &lt;left&gt;)</span> ;
</pre>
<h3 name="Values"> Values </h3>
<dl><dt>&lt;top&gt;, &lt;bottom&gt;</dt><dd> specify offsets from the top border edge of the box.
</dd><dt>&lt;right&gt;, &lt;left&gt;</dt><dd> specify offsets from the left border edge of the box normally (ie, in left-to-right text). For a box in right-to-left text they will indicate offset from right border edge.
</dd></dl>
<h3 name="Examples"> Examples </h3>
<pre class="eval"> img.clip04 { 
   clip: rect(10px, 20px, 20px, 10px);
 }
</pre>
<h3 name="Notes"> Notes </h3>
<h3 name="Specifications"> Specifications </h3>
<ul><li> <a class="external" href="http://www.w3.org/TR/CSS21/visufx.html#value-def-shape">CSS 2.1</a>
</li></ul>
<h3 name="Browser_compatibility"> Browser compatibility </h3>
<h3 name="See_also"> See also </h3>
Revert to this revision