自定义字体周围不需要的空间

时间:2013-05-02 10:37:33

标签: html css

我正在尝试在@ font-face工具包的帮助下为我的网站使用自定义字体。但是标签内部有一些不需要的空间。我用过h1标签。更改标签没有帮助。 Spacing in Chrome and IE

看看图片。在Chrome和其他人中,顶部有很多空间。但在IE中,空间在下面。对此有何解决方案?

代码 -

@font-face {
font-family: 'kozukalight';
src:url('fonts/kozgopr6nlight.eot');
src:url('fonts/kozgopr6nlight.eot?#iefix') format('embedded-opentype'),
    url('fonts/kozgopr6nlight.woff') format('woff'), 
    url('fonts/kozgopr6nlight.ttf') format('truetype'),     
    url('fonts/kozgopr6nlight.svg#kozukalight') format('svg');
font-weight:normal;
font-style:normal;  
}

h1 {
font: 60px 'kozukalight', Helvetica, Arial, sans-serif;
text-shadow: 0 1px rgba(255,255,255,0.5);
color: #383838;
}     

<body>
<h1>News and Events</h1>
</body>

1 个答案:

答案 0 :(得分:0)

这与自定义字体无关。 <h1>有默认保证金,所以你必须摆脱它:

h1 {
    font: 60px 'kozukalight', Helvetica, Arial, sans-serif;
    text-shadow: 0 1px rgba(255,255,255,0.5);
    color: #383838; padding: 0; margin: 0;
}

请参见fiddle的默认行为(很多“空格”,如您所述)和updated fiddle,边距设置为0。