css - font-face 上的字体粗细不起作用?

标签 css font-face webfonts

我正在尝试使文本变细,并且我已经看到它在网站上正常工作。 http://www.freshthemes.net/demo/backbone/about-us/ (在公司概览下)

这是我使用的样式:

.intro p{
    text-align: justify;
    margin-bottom: 8px;
    line-height: 22px;
    margin-bottom: 8px;
    font: 17px/21px "Open Sans", Arial, "HelveticaNeue", "Helvetica Neue", Helvetica, sans-serif;
    font-style: normal;
    font-variant: normal;
    font-weight: 300;
    color:#656565;
}

并且字体加载有:

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

font-weight 属性似乎没有任何作用。不介意我把它设置成300。 (它不应该,在以前的网站上它的工作)

这是我的 body :

<div class="intro">
    <p>
        This is the text that should be thinner
    </p>
</div>

我错过了什么?

最佳答案

您没有加载所有字体粗细。你应该尝试这样的事情:

<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700,800' rel='stylesheet' type='text/css'>

您可以在这个 google 页面上通过检查您需要的所有字体来根据您的需要自定义它(但如果您加载了太多字体,请注意网站速度!): http://www.google.com/webfonts#UsePlace:use/Collection:Open+Sans

关于css - font-face 上的字体粗细不起作用?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13360061/

相关文章:

javascript - HTML 对象底部裁剪,在移动设备上被 chop

css - 如何确保选择选项文本在 IE 中居中对齐?

jquery - 在按钮对齐方面需要帮助

html - css 网络字体中缺少符号

html - 如何在 Outlook 中实现 Open Sans Web 字体?

html - 将特定字形与网络字体一起使用

javascript - 在 anchor 和 img 标签之间插入元素

android - TTF 字体是否适用于 Android 4.0.3 的默认浏览器?

c# - 字体文件未使用 ASP.NET 包加载

css - 从现有字体创建@font-face