css 3字體創建換行符

Question

我在css3中使用@ font-face在網站上放置一些字體，而不使用頁面標題的圖像。

但是，我發現在使用font-face有點像段落或換行符時，會在標題下創建間隙。間隙大小與字體大小相關，並在大小增加時增加。

，我使用的字型爲Asenine這是比較小的，所以我有大小設置爲60像素

我不知道爲什麼發生這種情況，似乎無法找到一個修復。

這裏是我的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; 
} 

Answer 1

這可能是因爲行高的發生。字體越大，行高就越大。並使用CSS縮寫字體相關的設置，它的更好：

h1 { 
    font: normal 60px/0 'asenine', Arial, Helvetica, sans-serif; 
    text-shadow:7px 3px 4px #0c0c0c; 
} 

第一行意思是：正常體重，60像素的字體大小，0像素的line-height（以消除空間），字體家庭。