标签: google-webfonts
更改选择标记中单独选项的css font-family
我不知道这是否可行,如果没有,如果有人可以抛出可选的想法,但我试图在select标签中显示不同字体(特别是来自Google字体目录的字体)的下拉列表.在下拉列表中,我试图通过使用它所代表的字体为每个选项设置样式来显示预览
<option name="Tangerine" style="font-family:'Tangerine', verdana;">Tangerine</option>
但这似乎不起作用.任何线索为什么或如何解决它？
推荐指数
解决办法
查看次数
Google Chrome浏览器中文本的垂直对齐方式错误
我有创建"按钮"元素(带有边框的内联块容器中的文本)的问题,因为在某些字体大小的文本中有错误的垂直对齐(不是完美的中间).
我想使用Raleway(Google Web Font)和Bootstrap.文本容器的高度由line-height设置.
我在Windows 7上测试它...
在Firefox(第36版)上,一切都很完美
但问题出在Google Chrome上(第41版)
实时预览:http://biznes-dynamit.pl/test/marcin-dobroszek/font/
CSS代码的一部分:
/*Bootstrap default style*/
* {
box-sizing: border-box;
}
.btn {
display: inline-block;
vertical-align: middle;
}
/*custom style*/
body {
font-family: "Raleway";
}
.btn {
padding-top: 0;
padding-bottom: 0;
line-height: 16px;
font-size: 11px; /*real height: 8*/
}
.btn-sm {
font-size: 10px; /*real height: 7*/
line-height: 15px;
}
.btn-lg {
font-size: 12px; /*real height: 8-9*/
line-height: 16px; /*light, normal*/ …推荐指数
解决办法
查看次数
谷歌字体+网络包
我是webpack 2.2的新手; 我想知道在我的项目中集成Google字体的最佳方法.
我正在使用Webpack HTML插件index.html从模板生成一个.所以目前我直接在<script>标签中对Google字体CSS进行了硬编码,但我并不喜欢这种"解决方案",因为它根本不使用webpack:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<link href="https://fonts.googleapis.com/css?family=Love+Ya+Like+A+Sister" rel="stylesheet">
<body>
<div id='app'/>
</body>
</html>
推荐指数
解决办法
查看次数
当Web字体加载缓慢时,还原为无格式文本？
我正在使用Google网络字体,如下所示:
@font-face {
font-family: "Vollkorn";
font-style: normal;
font-weight: normal;
src: local('Vollkorn Regular'), local('Vollkorn-Regular'), url('http://themes.googleusercontent.com/static/fonts/vollkorn/v2/BCFBp4rt5gxxFrX6F12DKnYhjbSpvc47ee6xR_80Hnw.woff') format('woff');
}
body {
font-family: "Vollkorn", Georgia, Times, serif;
}
在Chrome中工作,没有"闪烁的无格式文本"(如此Typekit博客文章中所述).相反,在Web字体下载完成之前,文本根本不会加载.
通过快速连接,它很棒,因为字体异步加载非常快.但是,通过缓慢的连接,页面看起来像是空的几秒钟,直到Web字体加载 - 这是可用性差.
有没有一种聪明的方法可以在佐治亚州显示文本,然后在资源加载后添加Vollkorn字体？
我想我所说的是,我实际上非常喜欢"无格式文本的闪光",而不是空白页面,并希望强制执行此行为.
推荐指数
解决办法
查看次数
Google网络字体在IE8中不起作用
我正在使用此链接到某些Google字体:
<link href='http://fonts.googleapis.com/css?family=IM+Fell+English+SC|Snippet|Sarina|Crushed|Caesar+Dressing|Montez|Bad+Script|Sofia|Fontdiner+Swanky|Just+Me+Again+Down+Here|Voltaire|Geo|Coming+Soon|Wellfleet|Passion+One|Rock+Salt|Homemade+Apple|Meddon|Rosario' rel='stylesheet' type='text/css'>
我正在使用这个代码,它适用于某些浏览器:
<span style="font-size: 110px;font-family:montez;"><b>Abcdefg</b></span>
为什么字体不会出现在IE8中？http://jsfiddle.net/3NbE5/
推荐指数
解决办法
查看次数
为什么我的Google网络字体会出现像素化？
我想在一个简单的网站上使用谷歌字体.我正在使用的标签是
<link href='http://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css' >
css是
body {
padding: 0;
text-align: center;
line-height: 180%;
background: #1a2426;
color: #f7f7f7;
font-family: 'Lobster', serif;
}
问题是,当我在Chrome中将其拉出时,字体看起来像素化了.我想知道是否有人能解释原因？
例
推荐指数
解决办法
查看次数
Google Chrome字体不会在Chrome for iOS中加载
当我使用Google Webfonts时,它们可以在我关注的每个浏览器上加载,除了Chrome/iOS.这看起来很奇怪,因为它适用于Chrome for Mac和Safari for iOS,因此我认为这不是iOS问题或Google Chrome问题.它似乎特定于Chrome/iOS.
关于如何解决这个问题的任何想法或想法都会很棒!
谢谢!
编辑
我使用的是Google托管的Google网络字体,其中包含以下内容:
<link href="http://fonts.googleapis.com/css?family=Leckerli+One" rel="stylesheet" type="text/css" />
在我的字体(SASS)中,我使用以下内容:
h1
font-family: "Leckerli One", cursive
推荐指数
解决办法
查看次数
phantomjs +网络字体+字体加载器
我在一个环境中运行phantomjsnode.js,它进展顺利.目前我只是使用本地字体,但希望谷歌网页字体与phantomjs一起使用.
关于是否以及如何使用Web字体,有各种相互矛盾和令人困惑的报告phantomjs.还有像文章这样包含有死链接过时的信息.像这样的帖子表明phantomjs 2.0将支持或者可以支持网络字体,其他人则认为它不会支持2.0.1.在这篇文章中,有一个建议是webfonts在2.0中工作.
我已经尝试了很多选项,包括使用phantomjs 2.0和2.0.1二进制文件,但无法使其正常工作.可能是我正在使用Web字体加载器在我的js中加载Web字体,使用以下内容:
WebFont.load({
google: {
families: ['Droid Sans', 'Droid Serif']
},
loading: function() { console.log('loading'); },
active: function() {
console.log('active');
// hooray! can do stuff...
},
inactive: function() { console.log('inactive'); },
fontloading: function(familyName, fvd) { console.log('fontloading', familyName, fvd); },
fontactive: function(familyName, fvd) { console.log('fontactive', familyName, fvd); },
fontinactive: function(familyName, fvd) { console.log('fontinactive', …推荐指数
解决办法
查看次数
优化多个Google Web字体
从Google加载自定义字体时,它们为您提供了优化它们的方法:https://developers.google.com/webfonts/docs/getting_started#Optimizing_Requests
这意味着如果您只使用自定义字体作为标题,而不是加载整个字体,您可以告诉它您需要哪些字母,以便不加载整个字体字母.到现在为止还挺好.
但是,在示例中它只有一种字体样式.你怎么用两个呢？
例如,我使用它来加载字体的样式:
正常400我用于很多文本,但400italic只用于一个短标题.
如果我做:
它会加载整个400,只是我想要的400italic的"样品头"还是会做其他的事情？
推荐指数
解决办法
查看次数
支持UTF-8(土耳其语)字符的Google网络字体？
有谁知道,哪些字体支持土耳其字符没有问题？Sans或Serif无所谓.
示例:İÜÇÖÖ...
推荐指数
解决办法
查看次数