Question

假设我使用font-size:30px;和font-family:Verdana;。

enter image description here

我需要这些字母很大但又很薄，所以我尝试了font-weight:lighter;。

然而没有任何改变，有些字体会变小，有些字体不会受影响。

我怎样才能创建大而薄的字母？ CSS中有没有办法，或者这些是特定的字体？

Answer 1

这是我提出的最接近的事情。

div{
    font-family:Verdana;
    font-size:30px;
    font-weight:100;
    -webkit-text-stroke-color: rgb(255,255,255);
    -webkit-text-stroke-width: 1px;
    -webkit-font-smoothing: antialiased;
}

问题：
1.仅适用于webkit浏览器（Safari，Chrome）
2.如果文本背后的背景不是纯色，则可以看到它是文本笔划 http://jsfiddle.net/dru87/

Answer 2

要获得更精致的Verdana版本，由于字体不支持某些权重，您必须托管自己的字体版本，或使用已托管的其他字体来实现您的外观。

有些字体不支持更轻/更重的版本 - 如果有的话，它们可能与CSS数字刻度不一致（正如你所指出的那样）。

来自here。

因为有这么多专业品质的网络字体有各种各样的   权重，现在使用数字尺度比使用更有意义   当我们只需要处理'正常'（400）和'粗体'（600）时，它就会这样做。   通常，族的权重可以映射到这些值：

100：超轻

200：瘦

300：光

400：常规

500：半大胆

600：大胆

700：额外大胆

800：重

900：超重

注意关键字，通常是：可悲的是，现实是很多   字体只是不符合这种模式，就像一个家庭有一个   多种权重，或者他们自己的定义不一定   符合标准规模。

所以，长话短说，你必须要么主持一个“更薄”版本的字体（你制作/下载的那个），或者使用不同的字体。

IMO Tahoma，Hedley或Geneva是类似外观的字体，但是这些字体不是免费提供的 - 你可以在Google fonts查找一些，你和@minitech指出的字体。

Answer 3

选择细字体并应用bigtext.js/fittext.js或slabtext.js

Answer 4

并非所有字体都支持所有宽度。如果你正在寻找一些好的瘦字体。您可以查看这些thin google fonts列表。它们是免费且易于实施的。

Answer 5

font-weight的使用意味着从font-family请求不同重量的字体（特定字体）。 Verdana字体系列没有比平常更轻的字体，因此您可以正常使用。这适用于您通常可以在网页上使用的大多数字体。

例如，在Google Web Fonts中，您可以找到许多字体系列，其字体比普通字体轻，例如Source Sans Pro的权重为200和300。

注意：字体的亮度与字体有关。字体系列中的光（200）可能对应于另一个字体系列中的正常（400）。

Answer 6

第1步：加入来加载Google的字体

https://fonts.googleapis.com/css?family=Lato:100italic'rel ='stylesheet'type ='text / css'＆gt; https://fonts.googleapis.com/css?family=Lato:100'rel ='stylesheet'type ='text / css'＆gt;

步骤2：添加以下css属性。文本{ font-family：Lato，sans-serif;

font-weight：100;

font-size：7em; }

完成！

肯定会工作

有关详细信息，请访问http://tobiasahlin.com/typesource/01-elements-of-html-and-css/

大字体，薄字母

6 个答案: