1NSI : CSS transform avec translate, rotate, scale, skew, et matrix

Quelques valeurs possibles pour la propriété CSS transform :

#boite1 {
    border: 4px solid;
    width: 250px;
    height: 250px;
    font-size: 120px;
    text-align: center;
    line-height: 250px;
    background-color: red;

    transform: translateX(100px);
    transform: translateY(100px);
    transform: translate(100px, 100px); /* (translateX,translateY) */
    transform: rotateX(180deg);
    transform: rotateY(180deg);
    transform: rotateZ(180deg);
    transform: scaleX(2);     /* 1 par défaut */
    transform: scaleY(2);
    transform: scale(2, 2);   /* (scaleX,scaleY) */
    transform: skewX(45deg);
    transform: skewY(45deg);
    transform: skew(20deg, 20deg);  /* (skewX,skewY) */ 
    /* Remarque : skewX+skewY != 90° sinon, linéaire donc disparaît..attention */
    transform: matrix(1,0,0,1,0,0);
    /* matrix(scaleX, skewX, skewY, scaleY, translateX, translateY) */
    transform: matrix(1.5,0,0,1.5,200,200);

}