为什么translateY总是向一个方向发展

Question

<div class="one">
  <div class="two"></div>
</div>

.one {
  position: relative;
  height: 300px;
  background: #eee;
}
.two {
  width: 50px;
  height: 50px;
  background: #999;
  position: absolute;
  bottom: 0; // you can change it to top: 0;
  transform: translateY(100%);
}

即使我将底部更改为顶部，translateY仍然会向我移动（向下），而在从左向右移动时，例如，translateX会改变它的方向。

这是与我的环境有关的事情还是这是预期会发生的事情？如果是，有没有办法在tranlsate中使用负数而不改变方向？

请不要建议使用负值。我知道他们，这个问题与此无关。