MDN’s new design is in Beta! A sneak peek: https://blog.mozilla.org/opendesign/mdns-new-design-beta/

translateY()

translateY()函数表示在页面垂直移动元素. 这个transformation具有特征的就是通过 <length> 定义了元素垂直移动了多少

translateY(ty)是translate(0, ty)的一种简写方式.

语法

translateY(t)

 <length>是代表了纵坐标的向量变换.
笛卡尔坐标 ℝ2

在ℝℙ2上的同类坐标

在ℝ3上的笛卡尔坐标

在ℝℙ3同类坐标

在ℝ2 上的转换不会是线性变换但是并不能代表在笛卡尔坐标系统中使用矩阵

10001t001 10001t001 1000010t00100001
[1 0 0 1 0 t]

示例

HTML

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

CSS

p { 
  width: 50px;
  height: 50px;
  background-color: teal;
}

.transformed {
  transform: translateY(10px);
  background-color: blue;
}

结果

文档标签和贡献者

 此页面的贡献者: LangDonHJJ
 最后编辑者: LangDonHJJ,