From 074785cea106179cb3305637055ab0a009ca74f2 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:42:52 -0500 Subject: initial commit --- .../css/transform-function/scale3d()/index.html | 99 ++++++++++++++++++++++ 1 file changed, 99 insertions(+) create mode 100644 files/ru/web/css/transform-function/scale3d()/index.html (limited to 'files/ru/web/css/transform-function/scale3d()/index.html') diff --git a/files/ru/web/css/transform-function/scale3d()/index.html b/files/ru/web/css/transform-function/scale3d()/index.html new file mode 100644 index 0000000000..7caca80cca --- /dev/null +++ b/files/ru/web/css/transform-function/scale3d()/index.html @@ -0,0 +1,99 @@ +--- +title: scale3d() +slug: Web/CSS/transform-function/scale3d() +translation_of: Web/CSS/transform-function/scale3d() +--- +
{{CSSRef}}
+ +

scale3d() CSS функция изменяет размер элемента. Благодяря величине масштабирования определенной вектором, может изменять различные размеры в разных масштабах.

+ +

Это преобразование характеризуется вектором, координаты которого определяют, сколько масштабирования выполняется в каждом направлении. Если все три координаты вектора равны, масштабирование равномерно или изотропно, а форма элемента сохраняется. В этом случае функция масштабирования определяет гомотетическое преобразование.

+ +

Когда вне диапазона [-1, 1], масштабирование увеличивает элемент в направлении координаты; Когда внутри диапазона он сжимает элемент в этом направлении. При равном 1 он ничего не делает, а когда отрицательный, он выполняет точечное отражение и модификацию размера.

+ +

Синтаксис

+ +
scale3d(sx, sy, sz)
+
+ +

Значения

+ +
+
sx
+
Является  {{cssxref("<number>")}} , представляющим абсцисс вектора масштабирования.
+
sy
+
Является  {{cssxref("<number>")}} , представляющим ординату вектора масштабирования.
+
sz
+
Является  {{cssxref("<number>")}}, представляющим z-компонент масштабирующего вектора.
+
+ + + + + + + + + + + + + + + + + +
Cartesian coordinates on ℝ2Homogeneous coordinates on ℝℙ2Cartesian coordinates on ℝ3Homogeneous coordinates on ℝℙ3
Это преобразование применяется к пространству 3D и не может быть представлено на плоскости. sx000sy000sz sx0000sy0000sz00001
+ +

Примеры

+ +

Without changing the origin

+ +

HTML

+ +
<p>foo</p>
+<p class="transformed">bar</p>
+ +

CSS

+ +
p {
+  width: 50px;
+  height: 50px;
+  background-color: teal;
+}
+
+.transformed {
+  transform: perspective(500px) scale3d(0.8, 2, 0.2) translateZ(100px);
+  background-color: blue;
+}
+
+ +

Result

+ +

{{EmbedLiveSample("Without_changing_the_origin","100%","200")}}

+ +

Translating the origin of the transformation

+ +

HTML

+ +
<p>foo</p>
+<p class="transformed">bar</p>
+ +

CSS

+ +
p {
+  width: 50px;
+  height: 50px;
+  background-color: teal;
+}
+
+.transformed {
+  transform: scale3d(2, 3, 0);
+  transform-origin: center;
+  background-color: blue;
+}
+
+ +

Result

+ +

{{EmbedLiveSample("Translating_the_origin_of_the_transformation","100%","200")}}

-- cgit v1.2.3-54-g00ecf