Html CSS很薄的字体?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/8706023/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 12:17:51  来源:igfitidea点击:

CSS very thin font?

htmlcss

提问by user908683

How do I create very thin fonts with CSS, like at http://www.google.com/landing/newgadgets/?

如何使用 CSS 创建非常细的字体,例如http://www.google.com/landing/newgadgets/

Right now I'm using this, but I'm on a mac and I don't think "Helvetica Neue" is supported on windows.

现在我正在使用它,但我使用的是 Mac,我认为 Windows 不支持“Helvetica Neue”。

h1{
  font-size:64px;
  font-family:Helvetica Neue, Helvetica, Arial, sans-serif;
  font-weight:100;
}

Any ideas for thin, crisp fonts?

任何关于薄而清晰的字体的想法?

采纳答案by xandercoded

Google is using their font APIand CSS's @font-face

Google 正在使用他们的字体 API和 CSS@font-face

See the following reference in their code:

请参阅他们的代码中的以下参考:

<link href="//fonts.googleapis.com/css?family=Open+Sans:300,400,600,700&amp;subset=latin" rel="stylesheet">

Below is the exact definition that "registers"said font:

以下是“注册”所述字体的确切定义:

@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: local('Open Sans'), local('OpenSans'), url('http://themes.googleusercontent.com/static/fonts/opensans/v5/cJZKeOuBrn4kERxqtaUH3T8E0i7KZn-EPnyo3HZu7kw.woff') format('woff');
}

Then they simply apply that font to element/s:

然后他们简单地将该字体应用于 element/s:

h1, h2, h3, h4, blockquote, q, .maia-nav ul {
   font-family: 'open sans',arial,sans-serif;
}

Note:@font-facefonts don't render crisply on downlevel browsers. If you need to support them try - http://cufon.shoqolate.com/

注意:@font-face字体在下层浏览器上不会清晰地呈现。如果您需要支持他们,请尝试 -http://cufon.shoqolate.com/

回答by Blender

Just grab that font from Google's Web Fonts.

只需从Google 的 Web Fonts 中获取该字体即可

Select the fonts you want, select the styles (bold, italic, etc.) and Google will give you a <link />element to include in your HTML.

选择您想要的字体,选择样式(粗体斜体等),Google 将为您提供一个<link />包含在 HTML 中的元素。

That current font is called Open Sans:

当前字体称为Open Sans

<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>

Now you can use it:

现在你可以使用它:

font-family: 'Open Sans', sans-serif;

回答by craig1231

I use Google Fonts. A thin example:

我使用谷歌字体。一个细小的例子:

https://fonts.google.com/specimen/Raleway

https://fonts.google.com/specimen/Raleway