Exemple
Clip une image:
img
{
position: absolute;
clip: rect(0px,60px,200px,0px);
}
Essayez - le vous - même » Définition et utilisation
Qu'est-ce qui se passe si une image est plus grande que son élément contenant? - La propriété clip vous permet de spécifier un rectangle pour couper un élément absolument positionné. Le rectangle est spécifié comme quatre coordonnées, tous du coin supérieur gauche de l'élément à clipser.
Note: La propriété clip ne fonctionne pas si "overflow:visible" .
Valeur par défaut: | auto |
---|---|
Hérité: | no |
Animable: | yes. Read about animatable Try it |
Version: | CSS2 |
Syntaxe JavaScript: | object .style.clip="rect(0px,50px,50px,0px)" Try it |
support du navigateur
Les chiffres du tableau indiquent la première version du navigateur qui prend en charge entièrement la propriété.
Propriété | |||||
---|---|---|---|---|---|
clip | 1.0 | 8.0 | 1.0 | 1.0 | 7.0 |
Syntaxe CSS
clip: auto|shape|initial|inherit;
propriété valeurs
Valeur | La description | Joue-le |
---|---|---|
auto | Aucun découpage sera appliqué. Ceci est par défaut | Joue-le " |
shape | Clips un élément. La seule valeur valide est: rect ( top, right, bottom, left ) en ( top, right, bottom, left ) à ( top, right, bottom, left ) en ( top, right, bottom, left ) à ( top, right, bottom, left ) | Joue-le " |
initial | Définit cette propriété à sa valeur par défaut. Lisez à propos initial | Joue-le " |
inherit | Hérite cette propriété de son élément parent. Lisez à propos de hériteront |
Pages associées
Tutoriel CSS: CSS Positionnement
Référence HTML DOM: clip property