Funksiya scale

Funksiya scale elementi miqyaslayir: onu bir nece defe boyudur veya kicildir. Miqyaslama transform-origin xassesi ile teyin olunan noqte ətrafinda heyata keçirilir.

Bir ve ya iki parametr qebul ede biler, vergulle ayrilmiş. Əgər parametrler iki olarsa - birinci parametr üfüqi, ikinci parametr isə şaquli miqyaslamanı teyin edir. Əgər parametr bir olarsa, o zaman üfüqi ve şaquli miqyaslamani eyni anda teyin edir.

Parametrlerin deyeri tam ve ya kesir ededdir. Əgər o 1 -den boyukdurse - element boyuyur, kiçik olarsa (meselen, 0.5) - element kiçilir. Əgər 1 teyin etseniz - heç nə deyişmeyecek (bu standart deyerdir).

Sintaksis

cssselektor {
  transform: scale(bir ve ya iki eded);
}

Misal

Blokun üzerine gəldikdə miqyası hər iki ox üzrə 1.5 defe artiracayiq:

html<div id="elem">lorem ipsum</div>

css#elem {
  border: 1px solid black;
  width: 100px;
  height: 50px;
}
#elem:hover {
  transform: scale(1.5);
}

Результат:

Misal

Miqyası hər iki ox üzrə 2 defe kicildek:

html<div id="elem">lorem ipsum</div>

css#elem {
  border: 1px solid black;
  width: 100px;
  height: 50px;
}
#elem:hover {
  transform: scale(0.5);
}

Результат:

Misal

Miqyası X oxu üzrə 2 defe artiracayiq:

html<div id="elem">lorem ipsum</div>

css#elem {
  border: 1px solid black;
  width: 100px;
  height: 50px;
}
#elem:hover {
  transform: scale(2, 1);
}

Результат:

Misal

Miqyası Y oxu üzrə 2 defe artiracayiq:

html<div id="elem">lorem ipsum</div>

css#elem {
  border: 1px solid black;
  width: 100px;
  height: 50px;
}
#elem:hover {
  transform: scale(1, 2);
}

Результат:

Həmçinin bax