标签: google-font-api
图标按钮在加载前初始渲染时显示文本 - 谷歌字体
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200" />
<span class="material-symbols-outlined">
delete
</span>
初始阶段显示原始文本，一段时间后显示图标，我们如何解决这个问题？
2
推荐指数
推荐指数
1
解决办法
解决办法
909
查看次数
查看次数
使用 Google Fonts Roboto 的字体粗细，正常 (400) 和粗体 (700) 有效，浅色 (300) 无效
Link: https://50.62.213.246/gktest/
搜索栏中的占位符文本和输入文本不会响应 font-weight: 300；如果我尝试 font-weight: 700; 文字为粗体。正常 = 400，浅色 = 300，粗体 = 700，等等
所以我的问题是为什么在 font-weight: 300; 下文本看起来不亮。?
1
推荐指数
推荐指数
1
解决办法
解决办法
2万
查看次数
查看次数
@ font-face与Google字体
我已经在使用Google的字体，它可以按预期工作：
@font-face {
font-family: 'Chivo';
font-style: normal;
font-weight: 900;
src: local('Chivo Black'), url(http://themes.googleusercontent.com/static/fonts/chivo/v4/uOXSiKkEygwkvR4cgUzOz_esZW2xOQ-xsNqO47m55DA.woff) format('woff');
}
现在，我需要Google提供的另一种字体，但我不知道在哪里选择该网址。我可以在Google字体上看到的唯一网址是（例如，该字体）：
<link href='http://fonts.googleapis.com/css?family=Chivo:900' rel='stylesheet' type='text/css'>
但是googleapis网址不起作用，如果我用该网址替换src，则不会加载任何字体。
1
推荐指数
推荐指数
2
解决办法
解决办法
1万
查看次数
查看次数
Firefox没有渲染一些Source Sans Pro角色
使用谷歌字体"来源三世亲"我发现,Firefox和Safari浏览器将不会呈现捷克字符"s"和"C"正确(似乎回落到下一个选择的字体,我已经设定serif在以下示例为清晰起见:
然而,Chrome做得更好:
所以字体肯定包含这些字符.这是这些浏览器中的错误还是HTML中的错误？
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Test document</title>
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,400italic,700'
rel='stylesheet' type='text/css'>
<style>
body {
font-family: 'Source Sans Pro', serif;
font-size: 16px;
}
</style>
</head>
<body>
<p>Here is my Czech colleague's surname: Šime?ková</p>
</body>
</html>
1
推荐指数
推荐指数
1
解决办法
解决办法
1791
查看次数
查看次数
Google字体无法正常显示错误"请求资源上存在"否'Access-Control-Allow-Origin'标头"
对不起伙计,这可能是重复但我还没有找到解决方案
我一直在为我的所有项目使用Google字体.最近,有一些奇怪的事情发生,字体没有加载,当我检查控制台时,我发现这个错误
Font from origin 'http://fonts.gstatic.com' has been blocked from loading by Cross-Origin Resource Sharing policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost' is therefore not allowed access.
我已经在线检查并在stackoverflow上阅读了一些有关此事的答案,但未能找到解决方案.谷歌字体发生了什么,有没有办法解决这个问题？我想找一个简单而有效的解决方案,请帮忙.
1
推荐指数
推荐指数
1
解决办法
解决办法
9473
查看次数
查看次数
谷歌字体加载在桌面上,但不在移动设备上？
根据Google PageSpeed的推荐,我将大部分CSS都内联了.以前,我通过W3 Total Cache缩小了我的所有CSS,但是现在我内省了很多CSS,加上控制Google字体的所有CSS.
现在谷歌字体没有出现在移动设备上,但它们确实出现在台式机上.有这种情况的原因是什么？此处的移动屏幕截图显示未加载的字体.
<style>@font-face{font-family:'Pathway Gothic One';font-style:normal;font-weight:400;src:local('Pathway Gothic One'),local(PathwayGothicOne-Regular),url(https://fonts.gstatic.com/s/pathwaygothicone/v4/Lqv9ztoTUV8Q0FmQZzPqaA6LSHyyJAN5JIFgwWnj0Az3rGVtsTkPsbDajuO5ueQw.woff2) format("woff2");unicode-range:U+0100-024F,U+1E00-1EFF,U+20A0-20AB,U+20AD-20CF,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Pathway Gothic One';font-style:normal;font-weight:400;src:local('Pathway Gothic One'),local(PathwayGothicOne-Regular),url(https://fonts.gstatic.com/s/pathwaygothicone/v4/Lqv9ztoTUV8Q0FmQZzPqaHT0-GP0evTJPrdxn7U7ioo.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2212,U+2215,U+E0FF,U+EFFD,U+F000}@font-face{font-family:'Quicksand';font-style:normal;font-weight:400;src:local('Quicksand Regular'),local(Quicksand-Regular),url(https://fonts.gstatic.com/s/quicksand/v5/sKd0EMYPAh5PYCRKSryvW5Bw1xU1rKptJj_0jans920.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2212,U+2215,U+E0FF,U+EFFD,U+F000}@font-face{font-family:'Roboto Condensed';font-style:normal;font-weight:400;src:local('Roboto Condensed'),local(RobotoCondensed-Regular),url(https://fonts.gstatic.com/s/robotocondensed/v13/Zd2E9abXLFGSr9G3YK2MsIPxuqWfQuZGbz5Rz4Zu1gk.woff2) format("woff2");unicode-range:U+0460-052F,U+20B4,U+2DE0-2DFF,U+A640-A69F}@font-face{font-family:'Roboto Condensed';font-style:normal;font-weight:400;src:local('Roboto Condensed'),local(RobotoCondensed-Regular),url(https://fonts.gstatic.com/s/robotocondensed/v13/Zd2E9abXLFGSr9G3YK2MsENRpQQ4njX3CLaCqI4awdk.woff2) format("woff2");unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:'Roboto Condensed';font-style:normal;font-weight:400;src:local('Roboto Condensed'),local(RobotoCondensed-Regular),url(https://fonts.gstatic.com/s/robotocondensed/v13/Zd2E9abXLFGSr9G3YK2MsET2KMEyTWEzJqg9U8VS8XM.woff2) format("woff2");unicode-range:U+1F00-1FFF}@font-face{font-family:'Roboto Condensed';font-style:normal;font-weight:400;src:local('Roboto Condensed'),local(RobotoCondensed-Regular),url(https://fonts.gstatic.com/s/robotocondensed/v13/Zd2E9abXLFGSr9G3YK2MsMH5J2QbmuFthYTFOnnSRco.woff2) format("woff2");unicode-range:U+0370-03FF}@font-face{font-family:'Roboto Condensed';font-style:normal;font-weight:400;src:local('Roboto Condensed'),local(RobotoCondensed-Regular),url(https://fonts.gstatic.com/s/robotocondensed/v13/Zd2E9abXLFGSr9G3YK2MsDcCYxVKuOcslAgPRMZ8RJE.woff2) format("woff2");unicode-range:U+0102-0103,U+1EA0-1EF1,U+20AB}@font-face{font-family:'Roboto Condensed';font-style:normal;font-weight:400;src:local('Roboto Condensed'),local(RobotoCondensed-Regular),url(https://fonts.gstatic.com/s/robotocondensed/v13/Zd2E9abXLFGSr9G3YK2MsNKDSU5nPdoBdru70FiVyb0.woff2) format("woff2");unicode-range:U+0100-024F,U+1E00-1EFF,U+20A0-20AB,U+20AD-20CF,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Roboto Condensed';font-style:normal;font-weight:400;src:local('Roboto Condensed'),local(RobotoCondensed-Regular),url(https://fonts.gstatic.com/s/robotocondensed/v13/Zd2E9abXLFGSr9G3YK2MsH4vxAoi6d67T_UKWi0EoHQ.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2212,U+2215,U+E0FF,U+EFFD,U+F000}@font-face{font-family:'Roboto Condensed';font-style:normal;font-weight:700;src:local('Roboto Condensed Bold'),local(RobotoCondensed-Bold),url(https://fonts.gstatic.com/s/robotocondensed/v13/b9QBgL0iMZfDSpmcXcE8nBYyuMfI6pbvLqniwcbLofP2Ot9t5h1GRSTIE78Whtoh.woff2) format("woff2");unicode-range:U+0460-052F,U+20B4,U+2DE0-2DFF,U+A640-A69F}@font-face{font-family:'Roboto Condensed';font-style:normal;font-weight:700;src:local('Roboto Condensed Bold'),local(RobotoCondensed-Bold),url(https://fonts.gstatic.com/s/robotocondensed/v13/b9QBgL0iMZfDSpmcXcE8nIT75Viso9fCesWUO0IzDUX2Ot9t5h1GRSTIE78Whtoh.woff2) format("woff2");unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:'Roboto Condensed';font-style:normal;font-weight:700;src:local('Roboto Condensed Bold'),local(RobotoCondensed-Bold),url(https://fonts.gstatic.com/s/robotocondensed/v13/b9QBgL0iMZfDSpmcXcE8nL8EBb1YR1F8PhofwHtObrz2Ot9t5h1GRSTIE78Whtoh.woff2) format("woff2");unicode-range:U+1F00-1FFF}@font-face{font-family:'Roboto Condensed';font-style:normal;font-weight:700;src:local('Roboto Condensed Bold'),local(RobotoCondensed-Bold),url(https://fonts.gstatic.com/s/robotocondensed/v13/b9QBgL0iMZfDSpmcXcE8nAro84VToOve-uw23YSmBS72Ot9t5h1GRSTIE78Whtoh.woff2) format("woff2");unicode-range:U+0370-03FF}@font-face{font-family:'Roboto Condensed';font-style:normal;font-weight:700;src:local('Roboto Condensed Bold'),local(RobotoCondensed-Bold),url(https://fonts.gstatic.com/s/robotocondensed/v13/b9QBgL0iMZfDSpmcXcE8nACS0ZgDg4kY8EFPTGlvyHP2Ot9t5h1GRSTIE78Whtoh.woff2) format("woff2");unicode-range:U+0102-0103,U+1EA0-1EF1,U+20AB}@font-face{font-family:'Roboto Condensed';font-style:normal;font-weight:700;src:local('Roboto Condensed Bold'),local(RobotoCondensed-Bold),url(https://fonts.gstatic.com/s/robotocondensed/v13/b9QBgL0iMZfDSpmcXcE8nGPMCwzADhgEiQ8LZ-01G1L2Ot9t5h1GRSTIE78Whtoh.woff2) format("woff2");unicode-range:U+0100-024F,U+1E00-1EFF,U+20A0-20AB,U+20AD-20CF,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Roboto Condensed';font-style:normal;font-weight:700;src:local('Roboto Condensed Bold'),local(RobotoCondensed-Bold),url(https://fonts.gstatic.com/s/robotocondensed/v13/b9QBgL0iMZfDSpmcXcE8nPX2or14QGUHgbhSBV1Go0E.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2212,U+2215,U+E0FF,U+EFFD,U+F000}</style>
1
推荐指数
推荐指数
1
解决办法
解决办法
3115
查看次数
查看次数
谷歌字体不起作用,lato和raleway
我试图从谷歌导入字体但它无法正常工作.在本地系统中一切都很好但是当我们发布代码并在服务器上传时,它使用默认的浏览器字体无法正常工作.
平台:MVC.net 4.5 | Bootstrap 3.3.4 | HTML5 | CSS3
这是css.
@import url(http://fonts.googleapis.com/css?family=Lato:400,100,100italic,300,300italic,400italic,700,700italic,900,900italic);
@import url(http://fonts.googleapis.com/css?family=Raleway:400,100,200,300,500,600,800,700,900);
body { font-family: 'Lato', sans-serif;}
.banner h1{font-family: 'Raleway', sans-serif;}
1
推荐指数
推荐指数
1
解决办法
解决办法
5361
查看次数
查看次数
Google字体不能与CSS一起使用吗？
我当时在html页面上工作，进入了一半，并决定开始设计样式。。。我所有的样式都很好！直到我尝试获得Google字体。我按照所有说明进行操作，并将所有内容正确插入到CSS中。但是，当我在Chrome上查看该页面时，它仅显示“后备”通用sans-serif字体。这是我的CSS：
#page-first-open {
border: 1px solid black;
width: 1000px;
height: 500px;
text-align: center;
margin: auto;
position: relative;
top: 50px;
}
@import url(https://fonts.googleapis.com/css?family=Raleway);
#page-first-open p {
font-size: ;
font-family: 'Raleway', sans-serif;
}<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="test.css">
<script>
</script>
<title>User Test</title>
</head>
<body>
<div id="wrapper">
<div id="page-first-open">
<p>Hello, and welcome to this page. . .<br>
If you don't mind me asking, <br>
What is your name (or what you'd like to be called)?</p>
</div>
</div>
</body>
</html>有人可以告诉我我做错了什么（如果我做错了），或者指出正确的方向来使它工作？
1
推荐指数
推荐指数
1
解决办法
解决办法
7319
查看次数
查看次数
如何在全局上更改离子上的字体
我正在使用离子版3.9.2
我想要实现的是我想将离子应用程序的所有默认字体更改为我给定的自定义字体.
谷歌搜索后,我明白我必须设置app.scss文件夹中存在的字体外观app
这是我使用的代码:
@import url('https://fonts.googleapis.com/css?family=Raleway');
$font-family-base: "Raleway", sans-serif !default;
然而,即使这样做后,我无法更改整个应用程序的字体,因为它没有反映在应用程序中.
1
推荐指数
推荐指数
1
解决办法
解决办法
5412
查看次数
查看次数
添加 google font api 以选择菜单
我正在使用 google fonts API 中的所有字体制作一个选择框。我已经引用了这个https://developers.google.com/webfonts/docs/developer_api链接来了解有关 API 的更多信息，但到目前为止我还无法做到。
\n\n我添加了我为此制作的小提琴。
\n\n超文本标记语言
\n\n <select id="styleFont">\n <option value="0">Myraid Pro</option>\n <option value="1">Sans ref</option>\n <option value="2">Times New Roman</option>\n <option value="3"> Arial</option>\n </select>\n <br>\n <textarea id="custom_text"></textarea> \nCSS
\n\n #custom_text{ resize: none;}\xe2\x80\x8b\n脚本
\n\n $("#styleFont").change(function () {\n var id =$(\'#styleFont option\' + \':selected\').text(); \n $("#custom_text").css(\'font-family\',id);\n });\xe2\x80\x8b\n我的 API 密钥是https://www.googleapis.com/webfonts/v1/webfonts?key=AIzaSyB8Ua6XIfe-gqbkE8P3XL4spd0x8Ft7eWo
\n\n我如何将这些字体链接到小提琴中的选择框？
\n0
推荐指数
推荐指数
1
解决办法
解决办法
5621
查看次数
查看次数
谷歌webfonts - 有没有办法@import而不是<link>嵌入？
在一个网站上为客户工作 - 长篇故事,但我不允许编辑标记,只需包含一个覆盖样式表并通过那里进行调整.
我需要导入一个谷歌字体,但由于要求我不能使用普通的嵌入方法.有没有办法在样式表中@import一个谷歌字体？
编辑:澄清一下,我已经添加了以下代码,但没有成功(返回404):
@import url(http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,700,300italic);
0
推荐指数
推荐指数
1
解决办法
解决办法
1378
查看次数
查看次数
如何使用谷歌字体
我想使用Google字体的无数网络专业版.我用这个代码
<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=myriad+web+pro">
并使用css代码
font-family: "Myriad Web Pro", "Myriad Pro", Myriad, "Segoe UI", "Verdana", "Liberation Sans", "Nimbus Sans L", "Helvetica Neue", Helvetica, Arial, sans-serif;
但无法应用无数网络专业版.我怎么解决这个问题
-3
推荐指数
推荐指数
1
解决办法
解决办法
7842
查看次数
查看次数
标签 统计
google-font-api ×12
css ×9
fonts ×4
html ×4
css3 ×2
angular ×1
frontend ×1
html5 ×1
inline-code ×1
ionic2 ×1
ionic3 ×1
javascript ×1
mobile ×1
typescript ×1
webfonts ×1