CSS知识点:text-align-last段落最后一行设置对齐方式、transform:rotateY()翻转

一、text-align-last 段落最后一行设置对齐方式

  text-align-last 属性规定如何对齐文本的最后一行

  注意:text-align-last 属性只有在 text-align 属性设置为 "justify" 时才起作用。

  详见:text-align-last 属性

  遇到问题:只有一行div时,设置div宽度 80px,设置两端对齐 text-align: justify; 文字不生效。加上 text-align-last 就行了。

.m-label{
  width: 55px;
  min-width: 55px;
  margin-right: 10px;
  text-align-last: justify;
  text-align: justify;
}

二、transform:rotateY()翻转

1、问题背景:

  rotate(angle) 定义 2D 旋转,在参数中规定角度。但是这个角度针对的基准点,容易引起问题,比如把一个元素翻转 180deg 的话,会有一点错位。

2、解决方案:

  rotateX(angle) 定义沿着 X 轴的 3D 旋转。rotateY(angle) 定义沿着 Y 轴的 3D 旋转。

  以一个轴为基准线进行翻转,就不会产生一点错位的问题。

原文地址:https://www.cnblogs.com/goloving/p/14864643.html