CSS scale 属性

Rekomendasyon ng Kurso

scale Tinukoy at Gagamit

scale Ang katangian ay nagbibigay sa iyo ng kapangyarihan na baguhin ang laki ng elemento.

Ang katangian ay nagtutukoy ng halaga ng proporsyong pagbabawas sa x at y axis. Maaari mo ring magtutukoy ng proporsyong pagbabawas sa z axis.

Ang halaga ng pagbabawas ay maaaring maging isang halaga, dalawang halaga o tatlong halaga.
Kung ibinigay ang isang halaga, ang elemento ay babawasan sa x at y axis sa parehong proporsyong habang.
Kung ibinigay ang dalawang halaga, ang elemento ay babawasan sa x at y axis sa tinukoy na proporsyong habang.

Kung ibinigay ang tatlong halaga, ang elemento ay babawasan sa x, y at z axis sa tinukoy na proporsyong habang. scale Para sa mas mabuting pag-unawa, tingnan ang:Pagpapakita.

Babala:Isang ibang teknolohiya para sa pagbabawas ng elemento ay ang paggamit ng CSS scale() 函数 ng CSS transform katangian. Ang CSS na itinuturo sa pahinang ito scale Ang katangian ay maaaring maging isang mas madaling at mas direktang paraan para sa pagbabawas ng elemento.

Mga Halimbawa

Halimbawa 1

Ibabaguhin ang laki ng elemento:

div {
  scale: 2;
}

Subukan Nang Higit Pa

Halimbawa 2

Kapag scale Kung ang katangian ay naka-set ng dalawang halaga, i-set ang laki sa x at y axis. Dito, ang laki ng elemento sa x axis ay naging dalawang beses, at ang laki sa y axis ay naging kalahati:

div {
  scale: 2 50%;
}

Subukan Nang Higit Pa

Grammar ng CSS

scale: x-axis y-axis z-axis|initial|inherit;

Halaga ng katangian

Halaga	Paglalarawan
x-axis	Tinukoy ang proporsyong pagbabawas sa x-axis. Posibleng mga halaga: Numero Porsyento
y-axis	Tinukoy ang proporsyong pagbabawas sa y-axis. Posibleng mga halaga: Numero Porsyento
z-axis	Tinukoy ang proporsyong pagbabawas sa z-axis. Posibleng mga halaga: Numero Porsyento
initial	I-set ang katangian sa kanyang default na halaga. Tingnan ang: initial.
inherit	Mumunuan ang katangian mula sa magulang na elemento. Tingnan ang: inherit.

Detalye ng Teknolohiya

Default na halaga:	none
Inherits:	Hindi
Gawain ng animasyon:	Sumusuporta. Tingnan ang:Mga katangian ng animasyon.
Versyon:	CSS3
Grammar ng JavaScript:	object.style.scale="2 0.7"