如何在Web上使字体变薄

问题描述 投票:3回答:4

我正在尝试设计一个网站,并遇到字体样式和大小的问题。我看了很多网站以获得一些想法,例如,如果你看看这个网站:http://www.albionwestcoast.com/并检查右侧团队成员名称的字体样式和大小你可以看到他们显然使用格鲁吉亚(红色)但是当我尝试获得相同的形状时,我的字体看起来更大胆,更胖,我不知道为什么。

这是我得到的风格:

font-size: 2em;
font-family: Georgia,'Times New Roman',serif;
font-style: italic;
font-weight: normal; 

我错过任何东西以达到同样的效果吗?

css fonts
4个回答
9
投票

我发现,如果你添加属性-webkit-font-smoothing: antialiased;,文本将失去一点模糊性,看起来就像它在例如Photoshop(仅适用于webkit)。不确定这是否符合您的要求,但无论哪种方式,它都会使文本变得更薄。


1
投票

澄清/确认,您正在寻找CSS属性:

 font-weight: normal;

见:http://www.w3schools.com/cssref/pr_font_weight.asp

并非所有字体都支持低于400重量。


0
投票

也许是font-weight属性。如果为它指定一个数字值,介于100和900之间,总是以100为增量,即:100,200,300,400等,您将获得更大的灵活性......

  • 400与正常相同,700与粗体相同 font-weight: 300;

0
投票

您可以使用较小的字体大小,并通过CSS转换属性使其更高:

font-size: 1.5em;
transform: scale(1, 1.5);

在当前使用简单的2D变换是非常安全的(https://caniuse.com/#feat=transforms2d)。

© www.soinside.com 2019 - 2024. All rights reserved.