Cauta rapid aici ↑

CSS 3 -- TRANSFORMARE 2D

Proprietatea transform -- partea 1-a

CSS 3 vine cu o proprietate foarte utila si prin aceasta putem roti , redimensiona , inclina etc. un element in 2D . Proprietatea transform are mai multe valorii pentru 2D . Urmatoarele valorii sunt cele mai importante pentru 2D . In interiorul parantezelor vom avea anumite date despre cum vrem sa fie afectat elementul.

  • translate()
  • rotate()
  • scale()
  • skew()

Valoarea translate()

Aceasta valoare muta elementul pe axele X si Y fata de pozitia lui originala. In interiorul parantezelor putem avea valorii exprimate in procente sau pixeli . Exemplu { transform:translate(200px, 150px); }

Valoarea rotate()

Aceasta valoare roteste elementul in sensul acelor de ceasornic . In interiorul parantezelor putem avea valorii pozitive sau negative exprimate doar in grade si urmat de cuvantul deg (lb.engl.degrees).
Exemplu { transform:rotate(30deg); }

Valoarea scale()

Aceasta valoare mareste sau micsoreaza elementul pe latime si inaltime . In interiorul parantezelor putem avea valorii exprimate doar la o anumita scara . Exemplu { transform:scale(2.5); }

Valoarea skew()

Aceasta valoare inclina elementul . In interiorul parantezelor putem avea valorii pozitive si negative exprimate doar in grade si urmat de cuvantul deg (lb.engl.degrees). Exemplu { transform:skew(30deg, 20deg); }