prettify突出显示PRE与白空间：nowrap是IE中的一行

在Internet Explorer中，PRE样式为white-space:nowrap导致PRE中的代码在使用美化（http://code.google.com/p/google-code-prettify/）时位于一行中，。prettify突出显示PRE与白空间：nowrap是IE中的一行

<br/>是不是应该在PRE中产生一个新行？我在加载页面后检查了由prettify生成的HTML源代码，并在遇到换行符时生成<br/>。

查看http://blog.mikecouturier.com/2009/12/google-street-view-with-google-maps_27.html举例。

这在FF和Chrome中都不会发生。

感谢

编辑：这也许与此有关：Inserting a newline into a pre tag (IE, Javascript)

来源

2009-12-28 Mike Gleason jr Couturier

奇怪的是...你的示例链接不起作用，除非用下划线替换％5F，即使它是相同的。 – glomad 2009-12-28 18:28:07

这很奇怪..当我编辑帖子，下划线仍然存在.. – 2009-12-28 20:28:24

这很奇怪。我希望我能回答你的问题，我花了一段时间在调试器中看着它。在我看来，prettyPrint（）运行后，前块中有** no ** br标签。你确定他们在IE吗？ – glomad 2009-12-29 03:37:09

他们美化代码The Internet Explorer innerHTML Quirk：

HTML 元素的innerHTML属性是众所周知并广使用了。它能够将中元素的完整内容设置为一个，包括元素等。由于QuirksMode tests 已经显示，innerHTML是最快的方式来动态地改变页面的内容。

但是，innerHTML在 Internet Explorer中存在问题。

HTML标准要求在显示内容时进行变换。所有类型和数量的相邻空白都被折叠为一个单独的空间。这是一件好事 - 就像的一个例子，它允许我在这个源文件中添加很多换行符，而不必担心在显示的文本中出现奇怪的换行符。

Internet Explorer将这些转换应用于 innerHTML属性。这似乎是一个好主意：它显示过程中节省一点时间，因为如果内存中表示已经标准化，然后在浏览器没有有正常化时，它需要显示的文本。但是，规范化规则也有例外。值得注意的是，这些元素是<textarea>元素，元素<pre>元素，并且在CSS-aware 浏览器中，具有任何值的元素，但对于空白属性是正常的。

Internet Explorer不尊重这些特殊情况。第三个使得他们的优化是一个坏主意，因为空白可能在运行时更改，例如通过DOM更改为。在任何的情况下，Internet Explorer将规范归属于innerHTML 属性的所有分配。

这是另一个IE只有“bug”（即使是他们发明了innerHTML）。在第一个链接中，你有解决这个问题的方法，但是正如卢卡斯指出的，所有这些都指向你无法控制的谷歌代码。

来源

2010-07-09 14:08:35 AlexV

嘿litb，你说的没错，在版本的IE6和IE7的标签pre代码显示在1线。我已经为浏览器IE6和7添加了这个小修补程序。

我已经测试过它，它工作正常，这有点hacky，因为我实际上用<p>标签代替<br>标签，但这不会在IE6和7浏览器中造成任何视觉差异。

您可以在HTML页面的任何位置添加此代码段。它使用jQuery。

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> 
<script> 
$(document).ready(function(){ 
    // this BR issue seems to happen only in browser 
    // msie version 6.0 and 7.0 
    if($.browser.msie && ($.browser.version == "6.0" || $.browser.version == "7.0")) { 

     // replace all <br>s in the .prettyprint section 
     // with <p> tags. <p> tags have the same visual behavior as <br> tags 
     // in IE 6 and 7 
     $(".prettyprint br").each(function(){ 
      $(this).replaceWith($("<p></p>")); 
     }); 

    } 

}); 
</script>

这可能是谷歌之前你最好的选择修复了IE6 & 7.

来源

2010-07-07 16:00:14

我会在家尝试一次，谢谢 – 2010-07-09 14:22:10

+1，我和社区一起回答了.. – 2010-07-12 19:35:52

prettify突出显示PRE与白空间：nowrap是IE中的一行

回答

相关问题