html - 使用 CSS 水平拉伸文本

Question

我需要水平拉伸文本，但我唯一能找到的是font-stretch，根据 w3schools 的说法，任何浏览器都不支持它。

有没有其他方法可以达到这种效果？

Answer 1

是的 - 您可以通过使用CSS 2D 变换来实现这一点。

这是一个有效的JSFiddle。

请注意，下面的小提琴/代码中的示例适用于 Chrome/Safari (WebKit)，但是，您可以通过使用 、 和等效的前缀/方法在所有主要浏览器中使用-moz-2D-o-转换ms！

HTML：

<span>Hello!</span>

CSS：

span {    
  transform:scale(3,1); 
  -webkit-transform:scale(3,1);
  display:inline-block; 
}

支持：

它在 Chrome、Firefox、IE9+ 和 Opera 浏览器中受支持。

Answer 2

你是这个意思吗？使用 CSS：

text-align: justify