From 9bf6693b2edd5281c1577856895c55653a41dc01 Mon Sep 17 00:00:00 2001 From: MDN Date: Sat, 19 Mar 2022 00:13:08 +0000 Subject: [CRON] sync translated content --- .../web/css/transform-function/scale()/index.html | 125 --------------------- 1 file changed, 125 deletions(-) delete mode 100644 files/pt-br/web/css/transform-function/scale()/index.html (limited to 'files/pt-br/web/css/transform-function/scale()') diff --git a/files/pt-br/web/css/transform-function/scale()/index.html b/files/pt-br/web/css/transform-function/scale()/index.html deleted file mode 100644 index c249bd6931..0000000000 --- a/files/pt-br/web/css/transform-function/scale()/index.html +++ /dev/null @@ -1,125 +0,0 @@ ---- -title: scale() -slug: Web/CSS/transform-function/scale() -tags: - - Função CSS - - Referencia - - Transformações CSS -translation_of: Web/CSS/transform-function/scale() ---- -
{{CSSRef}}
- -

A função CSS scale() define uma transformação que redimensiona um elemento no plano 2D. Como o redimensionamento é definido por um vetor, ele pode transformar as dimensões verticais e horizontais em escalas diferentes. Seu resultado é um dado do tipo {{cssxref("<transform-function>")}}.

- -

- -

Essa transformação de redimensionamento é caracterizada por um vetor bidimensional. Suas coordenadas definem o quanto cada direção deve ser redimensionada. Se as duas coordenadas forem iguais, o redimensionamento é uniforme (isotrópico) e a proporção do elemento é preservada (isto é uma transformação homotética).

- -

Quando o valor de uma coordenada está fora do alcance [-1, 1], o elemento cresce ao longo daquela dimensão; quando está dentro, ele encolhe. Se for negativo, o resultado é um ponto de reflexão naquela dimensão. O valor 1 não tem efeito.

- -
Nota: A função scale() apenas redimensiona em 2D Para redimensionar em 3D, use scale3d() ao invés.
- -

Sintaxe

- -

A função scale() é especificada com um ou dois valores, que representam a quantidade de redimensionamento a ser aplicada em cada direção.

- -
scale(sx)
-
-scale(sx, sy)
-
- -

Valores

- -
-
sx
-
Um {{cssxref("<number>")}} representando a abscissa do vetor de redimensionamento.
-
sy
-
Um {{cssxref("<number>")}} representando a ordenada do vetor de redimensionamento. Se não for definida, seu valor padrão ésx, resultando em um redimensionamento uniforme que preserva a proporção do elemento.
-
- - - - - - - - - - - - - - - - - - - - - -
Coordenadas cartesianas em ℝ2Coordenadas homogêneas em ℝℙ2Coordenadas cartesianas em ℝ3Coordenadas homogêneas em ℝℙ3
sx0 0sy sx000sy0001 sx000sy0001 sx0000sy0000100001
[sx 0 0 sy 0 0]
- -

Exemplos

- -

Redimensionando as dimensões X e Y juntas

- -

HTML

- -
<div>Normal</div>
-<div class="scaled">Redimensionado</div>
- -

CSS

- -
div {
-  width: 80px;
-  height: 80px;
-  background-color: skyblue;
-}
-
-.scaled {
-  transform: scale(0.7); /* Equal to scaleX(0.7) scaleY(0.7) */
-  background-color: pink;
-}
-
- -

Resultado

- -

{{EmbedLiveSample("Scaling_the_X_and_Y_dimensions_together", "200", "200")}}

- -

Redimensionando dimensões X e Y separadamente e transladando a origem

- -

HTML

- -
<div>Normal</div>
-<div class="scaled">Redimensionado</div>
- -

CSS

- -
div {
-  width: 80px;
-  height: 80px;
-  background-color: skyblue;
-}
-
-.scaled {
-  transform: scale(2, 0.5); /* Igual a scaleX(2) scaleY(0.5) */
-  transform-origin: left;
-  background-color: pink;
-}
-
- -

Resultado

- -

{{EmbedLiveSample("Scaling_X_and_Y_dimensions_separately_and_translating_the_origin", "200", "200")}}

- -

Compatibilidade com navegadores

- -

Veja o dado do tipo <transform-function> para informações de compatibilidade.

- -

Ver também

- - -- cgit v1.2.3-54-g00ecf