html - CSS:2 种厚度 - 1 种字体

标签 html css fonts google-font-api

我使用 Google Roboto Font在我的网站上,但我有一个小实现问题。 Google 允许我们在导入前调整字体粗细:

粗细为700的字体导入代码

@import url('https://fonts.googleapis.com/css?family=Roboto:700');

粗细为300的字体导入代码

@import url('https://fonts.googleapis.com/css?family=Roboto:300');

我的问题是,CSS 中的用法不依赖于两个导入。这意味着它总是

font-family: 'Roboto', sans-serif;

而且我无法选择要使用的 2 种导入字体中的哪一种。

最佳答案

在 CSS 方面,您必须分别应用这些规则:

font: normal 300 16px 'Roboto', sans-serif; //thin font
font: normal 700 16px 'Roboto', sans-serif; //bolder font

关于html - CSS:2 种厚度 - 1 种字体,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40515940/

相关文章:

html - 绝对元素不放在相对元素之上

php - 下拉 Bootstrap 菜单未在网页上填充

php - 在 Magento 商店中更改字体

javascript - D3.js 径向可折叠径向树(每个分支 1 个分支)

css - Safari 不支持字体功能设置?

html - 嵌入 OpenType 字体文件

jquery - 使用 jQuery 在元素后换行文本

HTML5向左拖动元素不显示水平滚动条

jquery - 在 DIV 中,链接在溢出到新行后重叠

javascript - 获取图像宽度的总和并将该总和应用于 div