是否可以使用CSS调整字体的垂直缩放?

时间:2012-08-07 05:16:43

标签: css fonts scaling embedded-fonts

我使用嵌入字体作为网站上的顶级导航元素 Helvetica6516px它是完美的宽度,但我需要它 约为当前身高的90%

在Photoshop中,解决方案很简单 - 调整垂直缩放。

有没有办法用CSS做同样的事情?如果是这样,怎么样 它支持得好吗?

这是基本导航编码的jsFiddle

1 个答案:

答案 0 :(得分:83)

transform属性可用于缩放文本:

.menu li a {
  color: #ffffff;
  text-transform: uppercase;
  text-decoration: none;
  font-family: "HelveticaNeue-Medium", sans-serif;
  font-size: 14px;
  display: inline-block;
  transform: scale(1, 1.5);
  -webkit-transform: scale(1, 1.5); /* Safari and Chrome */
  -moz-transform: scale(1, 1.5); /* Firefox */
  -ms-transform: scale(1, 1.5); /* IE 9+ */
  -o-transform: scale(1, 1.5); /* Opera */
}