我正在使用从dafont.com获得的CGF蝗虫抗性字体这是字体的外观:http ://www.dafont.com/cgf-locust-resistance.font,这是它在我身上的外观网页:https://postimg.org/image/r2a1xcxun/
如您所见,这些字母看起来更加紧凑,尤其是在“ F”,“ A”和“ E”上。这是我的CSS和HTML代码。有人知道为什么会这样吗?
HTML:
<html>
<head>
<meta charset="UTF-8">
<title>Gears Of War</title>
<link rel="stylesheet" type="text/css" href="index.css">
</head>
<header>
<h1>GEARS OF WAR</h1>
</header>
<body>
<?php
// put your code here
?>
</body>
</html>
CSS:
body {
background-color: #1a1a1a;
}
header {
font-family: CGF Locust Resistance;
letter-spacing: 30px;
text-align: center;
font-size: 28px;
color: lightgray;
text-shadow:
-1.5px -1.5px 0 black,
1.5px -1.5px 0 black,
-1.5px 1.5px 0 black,
1.5px 1.5px 0 black;
}
字体声明:
@font-face {
font-family: cgf_locust_resistanceregular;
src: url('Downloads/cgf_locust_resistance-webfont.woff2') format('woff2'),
url('Downloads/cgf_locust_resistance-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
问题可能是由于h1标签具有默认的浏览器样式,该样式强制将font-weight设置为bold。尝试将h1标签的font-weight设置为normal,问题应该消失了。
字体可能不能很好地配合大胆的样式。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句