doctype中的更改会导致网页呈现不同的效果 [英] change in doctype causes webpage to render differently
问题描述
现在，我添加了<！doctype html> 到开头。不幸的是，它现在呈现不同。
有一个div应该垂直填充页面;现在它只填充页面的上半部分（下半部分是空的）。
这是div的CSS：
#thediv {
float：left;
宽度：48％;
身高：95％;
margin：2px 2px;
}
我的问题：
<！doctype html> 导致浏览器尝试将其呈现为HTML5？< html> 和< body> 标签的高度（以及任何其他标签包含 #thediv 至100％：
html，body {
height：100％;
}
doctype使页面呈现在标准模式下，而不是在怪癖模式下。我推荐阅读同名博客和 doctype页面。 p
这个问题的简短摘要是这样的：在互联网繁杂的日子里，当今所有浏览器都没有超过第4版时，每个浏览器都有自己的特色， em>不同 - 不是更符合规范。当浏览器制造商同意遵守相同的规范时，他们也决定继续支持构建网页的旧方法（怪癖模式），以便旧网页仍能在新浏览器中正确呈现。这种怪癖模式仍然内置于大多数浏览器中 - 当它们检测到看起来像在那些令人兴奋的日子里构建的页面时，它们会激活它。每种浏览器的检测和解析方法都不同 - 这里是IE 8的一个例子。
I have a webpage that previously had no doctype declaration.
Now, I've added <!doctype html> to the beginning. Unfortunately, it now renders differently.
There is a div that is supposed to fill the page vertically; now it only fills the top half of the page (the bottom half is empty).
Here is the div's CSS:
#thediv {
float: left;
width: 48%;
height: 95%;
margin: 2px 2px;
}
My questions:
- how do I get the div to fill the whole page vertically again? (more important)
- does adding
<!doctype html>cause the browser to try to render it as HTML5? - why would changing the doctype cause this difference? (less important)
You'll need to set the height of the <html> and <body> tags (and any other tags that contain #thediv to 100% as well:
html, body {
height: 100%;
}
The doctype causes the page to render in standards mode rather than in quirks mode. I recommend reading about quirks mode on the blog of the same name and on the doctype page.
The short summary of the issue is this: in the heady days of the internet when none of the browsers still around today were above version 4 every browser distinguished itself by being different - not by being more spec compliant. When the browser manufacturers agreed to all abide by the same spec they also decided to continue to support older ways of building web pages (the quirks mode) so that the old pages would still render properly in the new browsers. This quirks mode is still built into most browsers - they activate it when they detect a page that looks like it was built in those heady days. Each browser's detection and resolution method is different - here's an example of IE 8's.
这篇关于doctype中的更改会导致网页呈现不同的效果的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
![这里是IE 8的一个例子](\"http://hsivonen.iki.fi/doctype/ie8-mode.png\"){kind=link}
