使用窄分辨率时，标题字母重叠

Question

我将自举添加到我的网站，并且我注意到，当我使用窄分辨率（窗口大小）时，我的标题重叠。如果我的标题的大小很小，就像通常的H1大小一样，没有问题。但是当使用大尺寸（检查下面的CSS）时，图像中出现的问题就会发生。

我该如何解决？有没有像垂直间距这样的属性，或类似的东西？我是一个新手与CSS。可能的解决方法是使用Fittext。

CSS代码：

.nevis-font {font-family: 'Nevis', Tahoma, sans-serif;} 
.ultra-head {font-size: 7.8em;} 

HTML代码：

<div class="row-fluid"> 
    <div class="span12"> 
     <br/> 
     <h1 class="text-center nevis-font ultra-head">DIOGO NUNES</h1> 
     <br/><br/><br/> 
    </div> 
</div> 

Answer 1

您应修改line-height：

.nevis-font { 
    font-family: 'Nevis', Tahoma, sans-serif; 
} 
.ultra-head { 
    font-size: 7.8em; 
    line-height: 1.5; 
} 

• 不要在像素中使用行高，它不会缩放。使用无单位的值（或百分比或ems，但相当于）。
• 请勿将line-height设置为1以下。
• 默认值大约是1.3或1.4
• accessibility guidelines recommend at least 1.5
• 还有，当你想使用的1线高度，但是当你确信不会有两行内容的原因。极少数情况下

字体厂商可以自由地做任何他们想做的基线和嵌入字体文件的其他属性：脚本字体可以跨越文本超过300线，如果他们想一些奇特的效果！ （我相信）。
TL;博士具有完全相同的版式参数，在每个字体和字符会占用不同的高度和宽度等

编辑：是否有负边缘的任意位置到萤火虫可见？