clip CSS propriété

Définition de la CSS clip.

La propriété CSS clip permet de recadrer un élément positionné avec position et dont la valeur est absolute.

.identifiant{
  clip : rect(0px, 50px, 50px, 0px);
  width : 200px;
  height : 200px;
  position : absolute;
}

La propriété de feuille de style clip CSS peut prendre la valeur de :

• auto : s'adapte au contenu.
• rect(v1, v2, v3, v4) : v1 début de la zone visible verticale, v2 fin de la zone visible horizontale, v3 fin de la zone visible verticale, v4 début de la zone visible horizontale. Toutes les unités de longueur sont acceptées sauf "%".
• inherit : hérite de propriété CSS clip de son parent.

Exemple de code clip CSS

Conditions d'application de la CSS clip.

La propriété CSS clip est applicable sur toutes les balises HTML ou XHTML dont la propriété CSS position est égale absolute.

Problème d'interprétation de clip en Css.

La propriété CSS clip ne marche pas si la propriété de feuille de style css overflow est égale à visible. Cependant sur les nouveaux navigateurs, cela n'est pas la cas.

Peut poser des problèmes si la propriété height CSS ou width CSS est pas précisée.

Les versions d'Internet Explorer < 8 n'acceptent pas les virgules.

Conditions d'animation de clip en CSS3.

La CSS clip est une propriété de feuille de style qui peut être utilisée pour les animations CSS et transitions CSS.