On testera dans cette activité la méthode skew() de css3, commencer par créer un fichier activiteskew.html
<!DOCTYPE html>
<html>
<head>
<title>activite skew</title>
<link rel="stylesheet" type="text/css" href="activiteskew.css" />
</head>
<body>
<h1>skew()</h1>
<p>incline l'élément dans un espace bidimensionnel horizontalement et verticalement ou simultanément dans deux directions</p>
<img class="original_pic" src="image1.jpg" alt="image1">
<img class="after_skew" src="image2.jpg" alt="image2">
</body>
</html>
associer le premier fichier à un deuxieme fichier css activiteskew.css
.original_pic {
transform: translate(10px, 12%);
}
.after_skew {
transform-origin: top right;
transform: skew(30deg, 0deg);
}
Tester le résultat!