Segoe UI Light字体在Google Chrome中无法正常显示 [英] Segoe UI Light Font Not displaying properly in Google Chrome
问题描述
我在我的网站使用Segoe UI Light字体。
使用的css如下。
.divMainHeader
{
font-family:Segoe UI;
font-size:28pt;
font-weight:lighter;
width:100%
}
但Google Chrome无法呈现此字体正确。我在Chrome中得到一个大胆的Segoe UI Light字体。
图片。
我使用的浏览器版本。
Internet Explorer:9 b
$ bMozilla Firefox:21
Google Chrome:27 >
难以在Firefox中工作。字体重量300不工作在所有版本的时间。以下代码适用于我,并与所有浏览器兼容。
font-family:Segoe UI Light ;
font-weight:300;
请参阅这里
这是来自HTML5解决方案,它可能会帮助你,因为它也在Visual Studio ...
悬停在CSS的字体weight选项将告诉你的重量的单词(光,半)等
100:Thin
200:Extra Light(Ultra Light)
300:Light
400:Normal
500:Medium
600:Semi Bold(Demi Bold)
700: Bold
800:Extra Bold
希望它有帮助。
按照以下选项,添加font-weight,而不是使用semibold或semilight.Just使用'segoe ui'with font-weight。
@ font-face {
font-family:Segoe UI。
font-weight:200;
src:local(Segoe UI Light);
}
@ font-face {
font-family:Segoe UI;
font-weight:300;
src:local(Segoe UI Semilight);
}
@ font-face {
font-family:Segoe UI;
font-weight:400;
src:local(Segoe UI);
}
@ font-face {
font-family:Segoe UI;
font-weight:600;
src:local(Segoe UI Semibold);
}
@ font-face {
font-family:Segoe UI;
font-weight:700;
src:local(Segoe UI Bold);
}
@ font-face {
font-family:Segoe UI;
font-style:italic;
font-weight:400;
src:local(Segoe UI Italic);
}
@ font-face {
font-family:Segoe UI;
font-style:italic;
font-weight:700;
src:local(Segoe UI Bold Italic);
}
I am using Segoe UI Light font in my website.
the css used is as follows.
.divMainHeader
{
font-family:Segoe UI;
font-size:28pt;
font-weight:lighter;
width:100%
}
But Google Chrome is not rendering this font properly. I am getting a bold font of Segoe UI Light in Chrome.
The Image.
The versions of browsers i'm using.
Internet Explorer : 9
Mozilla Firefox : 21
Google Chrome : 27
Its difficult to get this working in Firefox. Font weight 300 doesnt work few time in all versions. The below code worked for me and compatible with all browsers.
font-family: "Segoe UI Light","Segoe UI";
font-weight: 300;
See Here This is from a HTML5 solution, but it might help you too, as it's also in Visual Studio... Hovering over the CSS font-weight options will tell you the weight in words (Light, Semi, etc.) 100: Thin 200: Extra Light (Ultra Light) 300: Light 400: Normal 500: Medium 600: Semi Bold (Demi Bold) 700: Bold 800: Extra Bold Hope it helps.
Follow the below options and add font-weight instead of using semibold or semilight.Just use 'segoe ui' with combination of font-weight.
@font-face {
font-family: "Segoe UI";
font-weight: 200;
src: local("Segoe UI Light");
}
@font-face {
font-family: "Segoe UI";
font-weight: 300;
src: local("Segoe UI Semilight");
}
@font-face {
font-family: "Segoe UI";
font-weight: 400;
src: local("Segoe UI");
}
@font-face {
font-family: "Segoe UI";
font-weight: 600;
src: local("Segoe UI Semibold");
}
@font-face {
font-family: "Segoe UI";
font-weight: 700;
src: local("Segoe UI Bold");
}
@font-face {
font-family: "Segoe UI";
font-style: italic;
font-weight: 400;
src: local("Segoe UI Italic");
}
@font-face {
font-family: "Segoe UI";
font-style: italic;
font-weight: 700;
src: local("Segoe UI Bold Italic");
}
这篇关于Segoe UI Light字体在Google Chrome中无法正常显示的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!