Font Roboto is bolder with Firefox

I'm trying to install Roboto on my website using Google Fonts, and I feel desperate to see that Roboto is bolder (much bolder) in Firefox than in Google Chrome.

Here are my codes:

<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,700" rel="stylesheet"> 

and

 p { font-size: 1.4rem; line-height: 1.5; font-family: "Roboto", sans-serif; letter-spacing: 0; color: #313131; } 

And here are two previews of Roboto Font, first with Firefox, the second with Chrome:

Firefox roboto

Chrome roboto

As you can see, Chrome Roboto is much easier.

I don’t know why this is happening, but I found something on Google Font. Using Firebug on my own code, I found that the Roboto font used on their website has attributes:

 element.style { font-family: "Roboto script=all rev=1"; } 

And when you delete "Script = all rev = 1", Roboto becomes much bolder in Firefox and Chrome (but so much in Firefox). Just like in my work.

Does anyone have an answer, solution, or something else? I am lonely to see that even Google cannot tell me what script=all rev=1 and why this makes Roboto much easier in Google Font.

+5
source share
1 answer

The reason it is easier is because Chrome uses a locally installed Roboto font, which does not have a bold version, and thus reverts to the thin version (and not the web font). This may be Chrome, but I do not know any existing reports.

In accordance with getting Chrome to use an external font in CSS, the special font name works because the alternative font name Roboto script = all rev = 1 "is displayed in the Google Web Font style sheet, which obviously does not exist on the user's local system and thus Served by web font.

0
source

All Articles