浏览器渲染差异严格/过渡文档类型之间 [英] Browser Rendering Difference Between strict/transitional DOCTYPEs
问题描述
我注意到一个问题前一段时间，我从来没有得到的底部来了。希望有人能赋予它的光。是什么原因导致某些浏览器（Chrome浏览器，Opera和Safari）当我改变DOCTYPE从严格的过渡时期呈现不同的页面。我知道这一般的原因是怪癖被触发模式，但都为这两个文件的XHTML和CSS验证根据W3C校验。
I came across an 'issue' some time ago that I never did get to the bottom of. Hopefully somebody can shine a light on it. What causes certain browsers (Chrome, Opera and Safari) to render a page differently when I change the DOCTYPE from strict to transitional. I know the general cause of this is quirks mode being triggered, but both the XHTML and CSS for both files validate according to the w3c validator.
我只能假设，这些浏览器使用两个文档类型不同的内部样式表，但并没有真正知道他们为什么会这么做。我只是希望有人能证实为什么会这样。
I can only assume that these browsers use different internal style sheets for the two DOCTYPEs, but have no real idea why they would do so. I was just hoping somebody could confirm why this happens.
这可以看到的差异是标题图像'的底部，并在菜单栏的边界之间的空间。在上述浏览器中有两个之间没有间隙使用过渡DOCTYPE时，但使用严格时，有（在IE和FF的差距是present两个）。我终于摸索出，加入显示：块来img标签停止出现在所有情况下的差距（这是我的目标）
The difference that can be seen is the space between the bottom of the 'header image' and the border of the menu bar. In the aforementioned browsers there is no gap between the two when using a transitional DOCTYPE, but there is when using strict (in IE and FF the gap is present on both). I eventually worked out that adding display:block to the img tag stops the gap appearing in all cases (which was my objective).
推荐答案
这样看来，在默认情况下严格模式下的图像显示为内联元素。内嵌元素在底部给出一个空间，以占伸字符如g或q。由于图像将不会有任何伸字符这被认为奇怪的行为而导致引进几乎严格模式。在几乎严格模式下，所有的img标签都呈现为显示：块，而不是内联。进一步的细节可以发现这里。
It would appear that by default in 'strict' mode an image is displayed as an inline element. Inline elements are given a space at the bottom to account for descender characters such as g or q. Since an image will not have any descender characters this was considered strange behaviour which led to the introduction of 'almost strict' mode. In 'almost strict' mode all img tags are rendered as display: block rather than inline. Further details can be found here.
拼图的最后一块是所有现代浏览器呈现在严格模式，并与几乎严格模式过渡DOCTYPE页严格的DOCTYPE网页。更多细节可以发现 rel=\"nofollow\">。
The final piece of the puzzle is that all modern browsers render pages with a strict DOCTYPE in 'strict' mode and pages with a transitional DOCTYPE in 'almost strict' mode. More details can be found here.
非常感谢这两个摩西和莱利，一些他们提供的信息帮助我找到答案。
Many thanks to both Moses and Riley, some of the information they provided helped me find the answer.
这篇关于浏览器渲染差异严格/过渡文档类型之间的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
