Exemplo
Clipe uma imagem:
img
{
position: absolute;
clip: rect(0px,60px,200px,0px);
}
Tente você mesmo " Definição e Uso
O que acontece se uma imagem é maior do que o seu elemento que contém? - A propriedade do clipe permite especificar um retângulo para cortar um elemento posicionado de forma absoluta. O retângulo é especificado como quatro coordenadas, tudo a partir do canto superior esquerdo do elemento a ser cortada.
Note: A propriedade clip não funciona se "overflow:visible" .
| Valor padrão: | auto |
|---|---|
| Herdado: | no |
| Animatable: | yes. Read about animatable Try it |
| Versão: | CSS2 |
| sintaxe JavaScript: | object .style.clip="rect(0px,50px,50px,0px)" Try it |
Suporte a navegadores
Os números na tabela especificar a primeira versão do browser que suporta totalmente a propriedade.
| Propriedade | |||||
|---|---|---|---|---|---|
| clip | 1.0 | 8 | 1.0 | 1.0 | 7 |
CSS Syntax
clip: auto|shape|initial|inherit;Valores de propriedade
| Valor | Descrição | Jogue |
|---|---|---|
| auto | No recorte será aplicado. Este é o padrão | Jogue " |
| shape | Clips de um elemento. O único valor válido é: rect ( top, right, bottom, left ) | Jogue " |
| initial | Define essa propriedade para o valor padrão. Leia sobre inicial | Jogue " |
| inherit | Herda essa propriedade do seu elemento pai. Leia sobre herdar |
Páginas relacionadas
CSS tutorial: Posicionamento CSS
Referência HTML DOM: clip property