我在 css3 中使用 @font-face 在网站上放置一些字体,而不使用图像作为页面标题。
但是我发现使用字体有点像段落或换行符时,标题下方会产生间隙。间隙大小与字体大小有关,随着字体大小的增加而增加。
我使用的字体类型是 Asenine,它相对较小,所以我将大小设置为 60px
我不确定为什么会这样,而且似乎找不到解决方法。
这是我的 CSS
}
@font-face {
font-family:'asenine';
src: url('fonts/asenine.eot');
src: url('fonts/asenine.eot?#iefix') format('embedded-opentype'),
url('fonts/asenine.woff') format('woff'),
url('fonts/asenine.ttf') format('truetype');
}
h1{
font-size:60px;
font-family:asenine, Arial, Helvetica, sans-serif;
text-shadow:7px 3px 4px #0c0c0c;
font-weight:100;
}
最佳答案
这可能是因为行高而发生的。字体越大,行高越大。并且字体相关的设置使用CSS速记,这样更好:
h1 {
font: normal 60px/0 'asenine', Arial, Helvetica, sans-serif;
text-shadow:7px 3px 4px #0c0c0c;
}
第一行表示:正常粗细,60px 字体大小,0px 行高(删除那个空格),font-families。
关于css 3字体创建换行符,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12123322/