clip

Obsoleto: Esta característica ya no se recomienda. Aunque es posible que algunos navegadores aún lo admitan, probablemente ya se ha eliminado de los estándares web relevantes, está en proceso de eliminación o solo se conserva por motivos de compatibilidad. Evite usarlo y actualice el código existente si es posible; consulte latabla de compatibilidad en la parte inferior de esta página para orientar su decisión. Tenga en cuenta que esta característica puede dejar de funcionar en cualquier momento.

Resumen

La propiedad de CSSclip define qué porción de un elemento es visible. La propiedadclip se aplica solamente sobre elementos conposition:absolute oposition:fixed.

Advertencia:This property is deprecated. Useclip-path instead.

Valor inicial	`auto`
Applies to	absolutely positioned elements
Heredable	no
Valor calculado	`auto` if specified as`auto`, otherwise a rectangle with four values, each of which is`auto` if specified as`auto` or the computed length otherwise
Animation type	arectangle

Sintaxis

Sintaxis formal:clip =
<rect()>|
auto

<rect()> =
rect(<top> ,<right> ,<bottom> ,<left>)
Esta sintaxis refleja el estándar más reciente segúnCSS Masking Module Level 1. Es posible que no todos los navegadores hayan implementado todas las partes. ConsulteCompatibilidad del navegador para obtener información de soporte.

clip: rect(1px, 10em, 3rem, 2ch)clip: autoclip: inherit

Valores

<shape>

Una forma rectangular del formulario

rect(<top>, <right>, <bottom>, <left>)   /* sintaxis estándar */

rect(<top> <right> <bottom> <left>)      /* sintaxis compatible inversa */

donde<top> y<bottom> especifícan desplazamientos de laesquina del borde superior de la caja, y<right>, y<left> especifican desplazamientos de laesquina del borde izquiedo de la caja.

<top>,<right>,<bottom>, y<left> pueden cada uno tenerun valor<length> oauto.

auto

El elemento no se recorta (valor por defecto)

Ejemplos

css

p {  border: dotted;  position: relative;}#img2 {  position: absolute;  left: 263px;  clip: rect(40px, 200px, 150px, 30px);  /* sintáxis estándar, no soportada por Internet Explorer 4-7 */}#img3 {  position: absolute;  left: 526px;  clip: rect(40px 200px 150px 30px);  /* sintáxis no-estándar, pero soportada por todos los exploradores importantes incluyendo Firefox y IE */}