google-font-api

Chrome prefers web font over local font

由 泪湿孤枕 提交于 2019-12-11 08:43:38
问题 I am not understanding something about the way Chrome loads google fonts. Here is my html: <html> <head> <title>Montserrat Regular Google Fonts</title> <link href="https://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet"> </head> <body> <p style="font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 30px;"> "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt..." </p> </body> I have Montserrat Regular installed on my Windows 10

How to correct the ligatures of 'fi' and 'fl' in case of larger letter-spacing?

由 你说的曾经没有我的故事 提交于 2019-12-11 05:46:51
问题 I use Google font 'Roboto' and expanded letter-spacing of .3em . How in this case is posible to corect sticky ligatures of little 'f' letter in words consisting 'fl' and 'fi' ? I tried to change to font-family for 'Roboto' to 'sans' and 'sans-serif', but it looks so ridiculus in condition of expanded letter-spacing. Have you any advise? html,body{ min-width:100vw; max-width:100vw; min-height:100vh; max-height:100vh; margin: 0; padding: 0; } *{ margin: 0; padding: 0; box-sizing:0; } body {

Which load faster @font-face or link

由 孤街醉人 提交于 2019-12-11 05:29:37
问题 I'm trying to find out which one loads faster. Upon checking the audit tab in Chrome both approach result in a slow First meaningful paint . I'm using googleapi font to render fonts in my site. Below are the codes I'm comparing <link href='https://fonts.googleapis.com/css?family=Montserrat&subset=latin' rel='stylesheet'> vs @font-face { font-family: 'Montserrat'; src: url('../fonts/Montserrat/Montserrat-Regular.ttf') format('truetype'); } Now it seems that hosting the font on my local

Load fonts on demand

由 大城市里の小女人 提交于 2019-12-11 02:12:43
问题 My application has to support many fonts. User can select any font from given list of fonts. Loading all fonts synchronously or asynchronously does not make sense because user may use one of many fonts and its just waste of bandwidth. I have a select box with fonts name, I want to load font when user select font from select box. Using typekit I can divide fonts in separate kits but how do I load these kits on javascript event ? Can I achieve this using typekit , google fonts or any other

Loading font from google web fonts or fonts from own server, which one is more efficient in terms of page load time?

由 ╄→гoц情女王★ 提交于 2019-12-10 22:25:59
问题 While working with some custom fonts, I have two options either I can load a form from my own server or I can load a google web fonts. But my concern is which one efficient in terms of page load time? The way I am using css is @font-face { font-family: 'MyWebFont'; src: url('webfont.eot'); /* IE9 Compat Modes */ src: url('webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('webfont.woff') format('woff'), /* Modern Browsers */ } Here, while loading font, I am also using

Google Font Letter Height Not Consistent

由 岁酱吖の 提交于 2019-12-10 17:23:21
问题 I am having a weird issue in Chrome where a Google Font is showing inconsistent letter heights. It only happens when I use text-transform: uppercase and it is fixed if I use font-weight:bold . I have some example code, where you can see the S is too tall in the word TESTING : body { font-family: 'Exo 2' !important; line-height:1.42857143; } div { width:40px; } span.upper { display:block; margin-top:20px; font-size:18px; text-transform:uppercase; } span {text-transform:uppercase; } <link href=

Is it possible to specify custom name for a Google Font?

由 我的梦境 提交于 2019-12-10 14:36:34
问题 Here is a sample CSS h1 { font-family: 'header-font', arial, sans-serif; } p { font-family: 'paragraph-font', arial, serif; } Is it possible to load any remote Google Font (let say 'Lato') so that it's family name in CSS would be 'header-font'? Edit: The idea behind this is to be able to easily swap fonts in a WP theme. Unfortunately using variables in CSS preprocessors is not an option in my case. 回答1: Yes, you can give any name you want when you define the font family in the @font-face

Montserrat font isn't displayed on IE 10 and 11

由 爷，独闯天下 提交于 2019-12-10 02:36:54
问题 In this website http://themescreators.com/ela/ I am using some google fonts. All of them work well on Chrome, FF.. but on IE 10 and 11 on Windows 7, "Montserrat" font doesn't display. I have really not idea about what can be the issue, is IE incompatible with some google fonts? If you visit the site on windows 7 you will see clearly the issue, all "Montserrat" h1, h2... aren't visible. Thanks in advance! 回答1: First of all, you don't have defined any secondary font which can be displayed if

@font-face vs Google Fonts vs Cufon

由 主宰稳场 提交于 2019-12-10 01:36:39
问题 So I've been forced by circumstances into using @font-face on a site I'm developing, and have to say I'm impressed by the cross browser render quality compared to Google Fonts but it does seem to have a heavy impact on http requests compared to Cufon, as you need four variants per font for body copy and sometimes a couple for headings. I've generally worked with cufon as I've found it to be flexible, reliable cross-browser and mobile, and despite some odd white-space issues on occasion, easy

Google font api / json /php /json_decode

由 痴心易碎 提交于 2019-12-08 07:04:05
问题 I have this json var from google api : $json=' { "kind": "webfonts#webfontList", "items": [ { "kind": "webfonts#webfont", "family": "Jockey One", "variants": [ "400" ], "subsets": [ "latin", "latin-ext" ] }, { "kind": "webfonts#webfont", "family": "Josefin Sans", "variants": [ "100", "100italic", "300", "300italic", "400", "400italic", "600", "600italic", "700", "700italic" ], "subsets": [ "latin" ] }, .... ] }'; How can i decode $json with php in order to display informations like this :
订阅 google-font-api