css 设置 transform 无效

可被transform的元素有:block-level element 或 atomic inline-level element等,但不包括inline element.

例如:

<div class="box">
  <span>今天你吃了么?</span>
</div>

// css
span {
  transform: translateX(20px)
}

然而span标签并没有向右移动20px;

<div class="box">
  <span>今天你吃了么?</span>
</div>

// css
span {
  display: inline-block;
  transform: translateX(20px)
}

span标签向右移动20px;

原文地址:https://www.cnblogs.com/vickylinj/p/13431966.html