Question

我似乎在IE和FireFox中声明doctypes（可能）时遇到了问题。

这是我在屏幕截图中看到的问题的代码：

<div  id="contact" style="position:absolute; left:81px; top:2440px; width:639px; ">
<span class="contact_header">Getting in touch is easy
</div>
<div style="position:absolute; left:80px; top:2500px; width:320px; ">
<br><span class="contact_title">email me:</span></br>
<br><span class="contact_links"><a class="white" href="mailto:hello@superallan.com?subject=Hello superallan!&body= ">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;hello@superallan.com</a></span></br>
<br><span class="contact_title">tweet me:</span></br>
<br><span class="contact_links"><a class="white" target="_blank" href="http://twitter.com/#!/superallan">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;@superallan</a></span></br>
<br><span class="contact_title">phone me:</span></br>
<br><span class="contact_links">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;+44 (0) 7540 308 682</span></br>
</div>
<div style="position:absolute; left:400px; top:2500px; width:320px; ">
<br><span class="contact_title">write to me:</span></br>
<br><span class="contact_address">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;11 abbeyview</span></br>
<br><span class="contact_address">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;crossford</span></br>
<br><span class="contact_address">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;fife</span></br>
<br><span class="contact_address">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;scotland</span></br>
<br><span class="contact_address">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;united kingdom</span></br>
</div>

这是我目前的doctype：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd"><html lang=en-us>

这是该部分的CSS：

    .contact_title {
 font-family:"FairfieldLTStd55Medium", Georgia, serif;
 font-size: 18pt;
 line-height: 22pt;
 color: #FFF;
}

.contact_links {
 font-family:"FairfieldLTStd56MediumItalic", Georgia, serif;
 font-size: 18pt;
 line-height: 22pt;
 color: #FFF;
}

.contact_address {
 font-family:"FairfieldLTStd56MediumItalic", Georgia, serif;
 font-size: 18pt;
 line-height: 22pt;
 color: #FFF;
}

这是它在Firefox和IE中呈现的方式。 http://i.stack.imgur.com/l8h4q.jpg

当我将doctype更改为strict时，它在FF中看起来仍然很好，但IE使得行高更高。

有什么想法吗？或者可能 - 如何为IE修复它，因为它在其他方面工作得很好......

Answer 1

我注意到您对pt和font-size样式使用了line-height次测量。

请注意，pt适用于打印页面，并且无法在屏幕上准确呈现。如果您想在屏幕上使用像素完美准确的字体大小，请改用px。（您也可以使用em或%进行相对测量，但看起来您打算使用固定大小的测量值，因此px就是一个。）

有关详情，请参阅此页：http://css-tricks.com/css-font-size/

引用链接页面的相关部分：

就像在字体大小调整的显示器上像素的准确度非常准确一样，点大小在纸上是不准确的。要在打印页面时获得最佳的跨浏览器和跨平台结果，请设置打印样式表并使用磅值调整所有字体的大小。

为了更好地衡量，我们不使用点大小进行屏幕显示（除了它是荒谬的）的原因是跨浏览器的结果是截然不同的。

......听起来就像你正在看到的症状一样。

希望有所帮助。

Doctype问题可能会破坏IE中的行高和换行符

1 个答案: